Latest Article Get our latest posts by subscribing this site

Selamat tinggal .Co.Cc Good By

Pada postingan kali ini, kita tinggalkan sejenak tentang tool blogger dan lain".
Disini saya merasa kecewa pada salah satu tempat saya berlangganan domain gratis yaitu .Co.Cc

Seiring dengan menyebarluasnya isu bahwa Google Update pagerank. terdengar jugak kabar bahwa domain .Co.Cc telah di Banned?
Benarkah itu?

Atau Google yang sedang mengalami masalah(Maintenance) . . ??


Awalnya peristiwa ini saya tidak percaya, namun setelah saya selidiki, memang semua blog yang memakai domain .Co.Cc ini semua di deindeks oleh Google.
Saya jugak bertanya", Tadi siang sewaktu saya OL di sebuah warnet langganan saya, disana saya mengetikkan Google.co.id, tapi saya bingung kenapa Link blog saya tidak muncul di Awal Google?
Saya menganggap biasa, mungkin karna ada sesuatu yang salah dengan browser nya. Tapi setelah saya cobak di Laptop saya, ternyata memang tidak ada. Disana saya mulai bingung kenapa ini bisa terjadi. Akhirnya saya melihat artikel dari satu teman blog saya, disana dia mengatakan bahwa hosting tempat domain .Co.Cc telah di Banned.
Hati saya bercampur dengan gelisah, ya apa boleh buat, kita gk bisa apa-apa.

Setelah lama saya pikir" akhirnya saya bermaksud berpindah ke domain saya yang lama di http://chenkgelate.blogspot.com/

Jadi untuk sementara bagi sobat blogger yang sudah memasang Link saya yang .co.cc Silahkan di ubah menjadi link yang di atas . .

Dan untuk kunjungannya silahkan Klik link di bawah ini


Untuk sementara ini Link dari Blog chenkgelate.

Cara membuat Tab Slide Show Tab View

Tab Slide Show Tab View adalah sebuah widget yang berisi ringkasan artikel, gambar dan foto yang bergantian. Dengan membuat tab view, blog kita akan terlihat menarik dan mempermudah pengunjung melihat highlight yang kita pasang, tentu saja ini akan membuat pengunjung akan lebih tertarik membuka link / postingan yang kita pasang dalam menu tab view.

Bagaimana sih cara membuatnya?

Langkah Pertama :

1. Login ke Blogger
2. Masuk ke TATA LETAK --> EDIT HTML
3. Anda cari kode ]]></b:skin>
4. Letakkan kode di bawah ini di atas ]]></b:skin> :

.indentmenu{
font: bold 11px Arial;
width: 100%; /*leave this value as is in most cases*/

}

.indentmenu ul{
margin: 2px;
padding: 0;
float: left;
/* width: 80%; width of menu*/
background: transparent;
}

.indentmenu ul li{
display: inline;
}

.indentmenu ul li a{
float: left;
margin: 2px;
color: #000; /*text color*/
padding: 5px 11px;
text-decoration: none;
border: 1px solid #ccc;
}

.indentmenu ul li a:hover{
background:#ddd;
}

.indentmenu ul li a:visited{
color: white;
}

.indentmenu ul li a.selected{
color: white !important;
padding-top: 6px; /*shift text down 1px*/
padding-bottom: 4px;
border: 1px solid #000000;
background:#000000;
}

.tabcontentstyle{ /*style of tab content container*/
border: 1px solid gray;
width: 450px;
margin-bottom: 1em;
padding: 10px;
}

.tabcontent{
display:none;
}

@media print {
.tabcontent {
display:block !important;
}
}

5. Kamu download dulu kode berikut,
klik disini
6. Copy script tersebut dan letakkan sebelum kode </head>
7. Simpan template

Langkah kedua :

1. Masih posisi Login to Blogger kemudian pilih "Layout"
2. Klik pada "Page Element" trus pilih "Add a Gadget --> HTML/Javascript" (Tempatnya terserah kamu).
3.Copy Paste Script Berikut :

<div style="float:left;margin:0px 10px 0px 0px;padding:0px;height:350px;">

<div id="pettabs" class="indentmenu">

<ul>
<li><a href="#" class="selected" rel="tab1">1</a></li>
<li><a href="#" rel="tab2">2</a></li>
<li><a href="#" rel="tab3">3</a></li>
<li><a href="#" rel="tab4">4</a></li>

</ul>
<br style="clear: left"/>
</div>

<div style="width:240px;text-align:justify;padding: 5px; margin-bottom:1em">

<div id="tab1" class="tabcontent">
<a href="URL Artikel Kamu 1">
<img border="0" style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" alt="obamabush" width="240" src="URL Gambar 1?imgmax=800" height="152" title="obamabush"/></a>

<p><h3><a href="URL Artikelka Kamu 1">Judul Aritkel 1</a></h3></p>
Tulis deskripsi singkat artikel pertama kamu disini [...]
</div>

<div id="tab2" class="tabcontent">
<a href="URL Artikel Kamu 2">
<img border="0" style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" alt="beyone" width="240" src="URL Gambar 2?imgmax=800" height="152" title="beyone"/></a>

<p><h3><a href="URL Artikel Kamu 2">Judul Aritkel 2</a></h3></p>
Tulis deskripsi singkat artikel kedua kamu disini [...]
</div>

<div id="tab3" class="tabcontent">
<a href="URL Artikel Kamu 3">
<img border="0" style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" alt="Guns N 'Roses" width="240" src="URL Gambar 3?imgmax=800" height="152" title="Guns N 'Roses"/></a>

<p><h3><a href="URL Artikel Kamu3">Judul Aritkel 3</a></h3></p>
Tulis deskripsi singkat artikel ktiga kamu disini [...]
</div>

<div id="tab4" class="tabcontent">
<a href="URL Artikel Kamu 4">
<img border="0" style="border-right: 0px; border-top: 0px; border-left: 0px; border-bottom: 0px" alt="ipod" width="240" src="URL Gambar 4?imgmax=800" height="152" title="ipod"/></a>

<p><h3><a href="URL Artikel Kamu 4">Judul Aritkel 4</a></h3></p>
Tulis deskripsi singkat artikel keempat kamu disini [...]
</div> </div>

<script type="text/javascript">

var mypets=new ddtabcontent("pettabs")
mypets.setpersist(true)
mypets.setselectedClassTarget("link")
mypets.init(2000)

</script>

4. Simpan dan lihat hasilnya.

Keterangan :
-.ganti keterangan huruf diatas yang berwarna merah.
- ganti angka 2 yang berwarna hijau sesuai dengan keinginanmu ( 2 berarti waktu jeda tampil 2 detik )


Ok sobat Informasi Maya sekian dulu aja tip kali ini dari kang salman semoga bisa bermanfaat

Sumber

Cara pembuatan code simbol di blogger

Membuat Simbol / Logo TradeMark ( TM ), Registered, Copyright,  Derajat, dan simbol-simbol lain di Website dan Blog. Dari tema tersebut kang salman mempuntai beberapa tips sederhana mengenai cara membuat Logo Trademark (TM) untuk di aplikasikan di blog atau website kita. Ada yang bilang dengan memasang simbol ini membuat blognya menjadi lebih mantap dan profesional. Kalau menurut kalian bagaimana?
Silakan simak cara membuatnya di bawah ini :

  • Untuk membuat TradeMark alias TM
    TM adalah singkatan dari TradeMark atau merek dagang. Cara membuat tulisan TM nya seperti asksalman™ adalah sebagai berikut  : tambahkan kode &trade; setelah kata asksalman 
  • Kode untuk membuat Registered trademark
    Simbol Regitered Trademark adalah simbol yang diberikan untuk mengenali merek dagang yang sudah terdaftar. Coba perhatikan contoh ini : kangsalman®  . Silahkan tambahkan &reg; setelah tulisan sobat.
  • Kode  Simbol Copyright
    Simbol Copyright adalah lsimbol untuk hak cipta. Coba perhatikan template blog sobat pada bagian bawah(bagian credit) akan selalu ada simbol ini jika sobat menggunakan template yang sudah jadi. Perhatikan contoh ini : kumpulan informasi maya© . Silahkan letakkan kode &copy; setelah tulisan sobat
  • Kode untuk simbol Double Right Pointing (»)
    Kalau simbol yang satu ini bagusnya untuk membuat suatu sub dari suatu menu atau untuk rincian yang arahnya ke kanan, berikut kodenya&raquo;
  • Kode untuk membuat simbol Double Left Pointing («)
    Kebalikan dari simbol di atas. Kalau yang ini arahnya ke kiri, berikut kodenya &laquo;
  • Kode untuk membuat simbol Em-Dash
    Simbol yang satu ini mirip dengan tanda kurang/minus. Hanya saja ini lebih panjang, dan mungkin lebih cocok sebagai pemberi jarak antara link satu dengan link lainnya, dan bisa juga dijadikan sebagai bahan pembentuk smile tidur, berikut kodenya&#151;
  • Kode untuk membuat simbol Degree atau Derajat (°)
    ntuk membuat simbol derajat atau Degree seperti kode seperti berikut &deg;
  • Kode untuk membuat simbol per
     ½ kodenya: &frac12;     ¼  kodenya :&frac14;
  • Kode untuk membuat simbol Inverted exclamation mark atau tanda Seru terbalik
    Mungkin ini hanya sebagai simbol untuk menambah daya tarik tulisan anda. Simbol ini sama saja dengan simbol/tanda seru (!), namun ini bentuknya terbalik (¡), berikut kode untuk membuatnya : &iexcl;

Widget Artikel Terbaru di Blogger

Pasang widget artikel terbaru di blogspot. konten ini bisa kita nikmati lebih mudah karena blogger sudah lama me publish gedget ini. seperti judul di atas. gedget ini akan menampilakan artikel terbaru kita secara auto matis di side bar blog kita.
Ada 2 versi :
1.  Hanya Text saja
2.  Dengan Gambar

Lihat Gambar di bawah ini :
Recent Posts Advanced : Artinya widget menampilakan artikel terbaru berupa tulisan saja dan gambar/thumbnails.
Recesn Post :  Artinya widget menampilakan artikel terbaru berupa tulisan saja.
 Pilih salah satu di antara keduanya
Share it : Widget ini berfungsi untuk me-shere atikel/konten blog kita ketempat lain
Twitter Updates : Berfungsi untuk menampilkan tweet terbaru anda dan follow me.
Recent Comment : Menampilkan komentar terbaru di blog anda
Langsung saja cara buat widget artikel terbaru,
1.  Login ke Blogger
2.  Pilih Tata Letak/ Rancangan
3.  Pilih Tambah Widget
4.  Pilih Tab Unggulan kemudian Pilih Recent Post Advanced
5.  Isi data sesuai kebutuhan anda dan Ok

NB : Terdapat banyak pilihan widget silakan coba satu persatu

Membuat Refresh Otomatis pada blog

Efek Refresh Otomatis Blog
Membuat blog refresh otomatis. Mungkin anda semua sudah paham dengan kata "Refresh" yang biasa diartikan penyegaran,di mana Refresh ini sangat berperan sekali buat komputer kita. Banyak orang berpendapat refresh membuat komputer kita lebih cepat. Lalu bagaimana ya kalau fungsi refresh ini di terapkan kedalam blog??
Kali ini kang salman akan sedikit mengutak-atik kode meta agar bisa di hack dan memberi Efek Refresh Otomatis Pada Blog untuk mesin blogger

Baik kita mulai saja ya!
1. Login ke Blogger
2. Kemudian klik Rancangan dan Pilih Edit Html.
3. Selanjutnya silakan anda copy kode ini :
<meta http-equiv="refresh" content="600"/>
4. Lalu taruh saja kode tersebut di antara kode :

<head> .... </head>

*intruksi: pastekan di antara kode di atas.
atau saran dari saya simpan saja kode tadi kedalam bagian meta tag blog anda.,

*Bagi yang belum tau tentang meta tag, silakan menuju ke forum kang salman dan pilih katagori SEO disana ada tulisan salah satu member tepatnya disini : http://4jvohexlvs.tal.ki/20100723/memasang-super-meta-tag-dynamic-79215/

5. Jika sudah kemudian Simpan Template dan lihatlah hasilnya

Sangat mudah bukan cara membuat nya?

Penting!
Tulisan yang berwarna Merah di atas menandakan jumlah waktu yang akan me-reload atau refresh secara otomatis dalam hitungan detik.
Contoh : dalam kode diatas dituliskan "600" berarti blog atau website kita akan refresh secara otomatis dalam waktu 10 menit. karena 1 menit = 60 detik dan 10 menit = 600 detik.
Rubahlah angka "600" dengan waktu yang anda inginkan untuk me-refresh secara otomatis (dalam hitungan detik).


Keuntungan dari pengunaan refresh ini jelas akan mempercepat blog (khusus blog yang berat loh)

source: http://www.kucoba.com/

Membuat 3 Kolom Baru di Bawah Header

Cara menambahkan  3 kolom di bawah header. Hallo sobat informasi maya apa kabar? kali ini kang salman mau berbagi tips bagaimana cara membuat  kolom baru di bawah header dan cara menamambah kolom baru bawah body (footer). udah pernah main ke blog kang rohman belum? nah bila anda pernah kesana mungkin anda akan melihat pembagian kolom baru di bawah header. bagaimana sih cara buatnya :

Cara membuat head menjadi 3 kolom :

1.  Login ke blogger.
2.  Setelah masuk dasbor lalu pilih Tata Letak.
3.  setelah itu klik Edit HTML.
4.  Cari kode ]]></b:skin> 

5.  Copy kode di bawah ini dan simpan di atas kode ]]></b:skin>

    #Header-column-divide {
    clear:both;
    }
    .header-column {
    padding: 10px;
    }


    #header-column-divide {
    clear:both;
    }
    .header-column {
    padding: 10px;
    }


6.Selanjutnya Cari kode dibawah ini .

    <div id='header-wrapper'>
    <b:section class='footer' id='footer'/>
    </div>


7.Jikalau sudah ketemu Hapus kode <b:section class='footer' id='footer'/> kemudian ganti bengan kode dibawah ini .

    <div id='header-column-divide'>

    <div id='header1' style='width: 30%; float:left;
    margin:0; text-align:left;'>
    <b:section class='header-column' id='col1'
    preferred='yes' style='float:left;'/>
    </div>

    <div id='header2' style='width: 40%; float: left;
    margin:0; text-align: left;'>
    <b:section class='header-column' id='col2'
    preferred='yes' style='float:left;'/>
    </div>

    <div id='header3' style='width: 30%; float: right;
    margin:0; text-align: left;'>
    <b:section class='header-column' id='col3'
    preferred='yes' style='float:right;'/>
    </div>

    <div style='clear:both;'/>
    </div>


8.Klik Simpan Template .

Dan kemudian silakan anda lihat hasilnya

Memodifikasi Navigasi Post Defalut Blogger Newer Post, Home, dan Older Post

Mengganti tulisan navigasi page blogspot dengan gambar. Sobat blogger banyak sekali cara untuk membuat blog unik dan indah salah satunya adalah dengan memodifikasi blog dengan mengubah tampilan navigasi posting bertulisankan Newer Post, Home, dan Older Post atau Posting Baru, Beranda, Posting Lama, bisa dengan tulisan lagi atau dengan pun gambar. Jika anda ingin menggantinya dengan gambar silakan ikuti trik kang salman berikut ini :

Cara mengganti navigasi blog dengan gambar:
1. Login ke akun Blogger anda
2. Plih Layout > Edit HTML, lalu centang Expand Widget Template
3. Cari kode berikut:
<data:newerPageTitle/> ganti dengan <img src="URL-GAMBAR-PREVIOUS" border="0" />
<data:olderPageTitle/> ganti dengan <img src="URL-GAMBAR-NEXT" border="0" />
<data:homeMsg/> ganti dengan <img src="URL-GAMBAR-HOME" border="0" />
4. Jika sudah selesai simpan templates

Tips KS :
Jika Anda ingin mencari gambar yang bagus untuk navigasi halaman posting Anda, silakan searching di google image dengan keyword arrow left.png (untuk tanda panah kiri), arrow right.png (untuk tanda panah kanan) home.png (untuk tanda atau simbol beranda atau home)

Oke selamat mencoba..


Source: http://www.kucoba.com/

Membuat Icon Sidebar berbeda-beda

Untuk membuat tampilan icon sidebar berbeda, kalian sebenarnya hanya menambahkan kode berikut :

<h2><img border="0" src="URL GAMBAR ICON"style="padding:0px;" />
JUDUL SIDEBAR
</h2>


Untuk contoh tampilannya sendiri kalian bisa lihat pada gambar berikut ini:








untuk pemasangannya sendiri, saya rasa cara ini lebih gampang dari cara sebelumnya, karena kalian tinggal mengikuti tahap-tahapnya berikut ini:

1. Silahkan login ke blogger kalian
2. Masuk ke Rancangan
3. Pilih Elemen Halaman
4. Silahkan Edit gadget sidebar kalian dengan menambahkan kode tadi diatasnya, contoh :

<h2><img border="0" src="URL GAMBAR ICON"style="padding:0px;" />  
JUDUL SIDEBAR
</h2>masukkan kode script sobat


4. Simpan gadget kalian dan lakukan cara diatas pada widget sidebar yang lain, dan ingat siapkan icon/gambar berbeda jika ingin tampilan icon sidebarnya berbeda.

INGAT :
Jangan lupa menghapus atau menghilangkan judul sidebar pada kotak judul gadget


Selamat mencoba dan semoga bermanfaat dan SELESAI ...

source: http://www.z33s.co.cc/

How to add Blogger Share Buttons to Custom Blogger Templates

Recently, Blogger released their new Share Buttons feature which makes it easier for your Blog visitors to bookmark, tweet, fshare, email ,etc your post.

But, if you're using any custom blogger template.. you may not see the widget appearing in blog..even though you activate it.

So, if you have that problem. here is how to fix it.
(before making any changes..first backup your template)

1. Sign into Blogger > Design > Edit html
(tick the expand widget templates)

2. Add this line anywhere you want the widget to appear


<b:include data='post' name='shareButtons'/>


Normally, in most templates, you can add it after this line..


<p class='post-footer-line post-footer-line-1'>


If you don't find that above line in your template....
Find this one.


<p><data:post.body/></p>


and add this code after that line..



<p><data:post.body/></p>
<div style='clear:both; padding: 10px 10px 10px 10px;'> <b:include data='post' name='shareButtons'/> </div>


Note: If you're using Magazine style blogger template, You can find the data:post.body line TWO TIMES.. So, try in both ways and find out which one is working..and remove the other one.

Finally..Save the template!

If you still don't see it in your Blog, Make sure..you activated it by going to
Blogger dashboard > Design > Click the 'edit' button of the Blog post section.





Source: http://www.bloggertricks.com/

Pelaporan untuk para pelanggar TOS blogger

Assalamu'alaikum sobat blogger yang berbudiman. pada postingan kali ini. saya akan menshare tips n' info buat sobat blogger jika perlu. Yaitu tentang orang yang melanggar hak cipta milik kita..

Sebenarnya ini info baru saya dapat dari salah satu sobat blogger, tapi kog sobat ya? Kan dia udah gede dari saya.
Singkat saja Dia ialah Kang salman, siapa yang gk tau cobak, sama blog yang satu ini?
Para sobat blogger pasti sudah tau dengan blog ini bukan. Itu loch blogger yang Namanya Kucoba.com dengan slogannya blog nya yang membuat kita selalu kangen dan banyak info" kren di dalamnya yaitu "Kalau tidak kucoba, mana tau?" hehe kren jgk yah. Tapi slogan blog saya jugak kren kog hehe "Gak Ada Loe Gak Asiik".Loh kog malah promosi slogan blog saya sob?

Langsung saja, ini tips saya diberi amanah oleh Kang salman tadi malam untuk nge-repost e-mail yg di kirimkan nya. disana menjelaskan tentang bagaimana cara melapor ke google mengenai blogger "melanggar hak cipta milik kita" Wah bikin sakit hati aja tuh org ya. . hehe :)

Ya udh gk pakai basa basi lagi. Niih sob wasiat dari Kang salman yang telah diberikannya ke saya :)

Cara melaporkannya mudah sekali. coba kunjungi halaman ini :
http://www.google.com/support/blogger/bin/request.py?hl=en&contact_type=main_tos&blog_ID=2505994410404522154&blog_URL=http%3A%2F%2Fhttp://LINK-BLOG.blogspot.com%2F&rd=1

Perhatikan tulisan yang berwarna merah!
Ubah nama domain tersebut dengan domain blog yang copas atau blog yang melanggar aturan blogger. Nanti akan ada beberapa form yang harus di isi oleh Anda seperti identitas diri serta url yang di copas oleh orang lain.

Kang salman sudah menerapkan ini pada salah satu blog yang membuat kang salman kesal selama 6 bulan mengcopy semua update artikel di situs Kucoba.com ini hati-hatilah dengan blog ini sohibdikabisnis.blogspot.com (sudah di hapus pihak blogger sob)

  1. Kembali lagi. hukuman yang diberikan oleh google bermacam-macam tergantung tingkat pelanggaran.
  • hukuman paling ringan seperti biasanya adalah banned permanen url artikel yang di copas sehingga tidak pernah muncul lagi di mesin pencari seumur hidup
  • hukuman kedua adalah, pagerank di turunkan bagi yang sudah berpagerank dan status di deindexkan
  • hukuman tingkat tinggi yang di berikan oleh google adalah penghapusan blog beserta akun emailnya secara permanen
  • hukuman yang lebih parah lagi banned IP beserta semua akun didalamnya.

Selamat mencoba . . ! !

Green Hacker Blogger Template

Akhirnya sudah beberapa hari saya ingin berbagi Template buatan saya kepada sobat blogger, baru sekaranglah keinginan saya tercapai. Pada kali ini saya akan share kepada sobat blogger Blogger Templates yang saya beri nama "Green Hacker" sebenarnya sudah lama saya ingin berbagi karya kepada sobat blogger semua, tapi saya masih ragu, karna Blogger Templates saya ini masih banyak kekurangan nya yang mungkin ada yang tidak sobat blogger sukai. .
Baiklah agar tidak memperpanjang Muqodimah langsung aja ya sob nih SS nya:



Ini Templates sederhana bgt sob. tapi tampilannya itu ... yaaa lumayan kren lah sob . .

Category:
  • Colour " Green "
  • 3 Coloumn
  • 3 Footer
  • Transparant
  • Elegant Style
Features:
  • Readmore Automatic
  • Ads Ready
  • Breadcrumb Navigation
  • Related Post
  • Share button
  • and more features

Udah dulu ya sob infonya. silahkan digunakan dengan sebaiknya jika bermanfaat.

Update: Link download udah saya tukar dengan update templatenya.

Modifikasi Kotak Feedburner pada blog

Pada postingan saya kali ini (pada malam yang berbahagia) hehe ..
Saya ingin memberikan tips buat sobat blogger semua bagi yang ingin Memodifikasi tampilan kota Feedburnernya memakai gambar.
Sebenarnya sudah banyak Blog lain yang sudah share tentang bagaimana cara memodifikasi kotak berlangganan Feedburner ini.

Namun saya beranikan diri lagi untuk menshare ini Versi Ala Chenkgelate


Langsung aja ya sob di baca dan di ikutin petunjuknya :))

  1. Login ke Blogger
  2. Klik Menu Design/Rancangan
  3. Selanjutnya Klik Add a Gadget , Pilih HTML/JavaScript Add Di tempat yang ingin anda pasang kotak langganan Feedburner / Bagi yang sudah mempunyai kotak berlangganan Feedburner Silahkan :
  •  Klik Design/Rancangan
  • Selanjutnya pada Gadget kotak berlangganan Anda Klik Edit
Selanjutnya:

Copas Code HTML di bawah ini pada Form  HTML/JavaScript Add  yang anda inginkan

<style>
.form {
border:0px solid #ccc; /* warna garis pinggir form */
background: #ffffff /* warna background form */
padding:3px; /* spasi form */
width:ancho; /* panjang form */
height:180px /* tinggi form */
}

.rss {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEggT7liGCEwdq162oCdRpUr2-PM_MetVqCNu7n4rQiDLhJMssOUzX8FByGgroT0zoj4a0tXjfSdsabeg9kaP0hi893e1G8wiyCxdFVTjmeWqptSqdGeIipLZfep-vBWQ4-iUG7k1BFbBxZi/s128/rss_feed_logo.png") no-repeat top right;
}

.button {
background: #006699; /* warna tombol subscribe */
color: #FFFFFF; /* warna font subscribe */
font-size: 11px; /* ukuran font subscribe */
font-family: Arial, Tahoma, Verdana; /* font subscribe */
margin-left: 5px; /* margin kiri tombol subscribe */
border: 1px solid #234B69; /* warna garis pinggir tombol subscribe */
padding:3px 5px 3px 5px; /* jarak antara font dengan garis pinggir tombol subscribe */
font-weight: bold;
}
</style>

<div class="form">
<div class="rss">
<div style="font-weight:bold; color:#333333; font-size:15px; padding:10px 5px 5px 10px;"><a href="http://feeds.feedburner.com/chenkgelate"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7ZMF-wDTG1HB4seSpEjmNVWnp-8T7-gH-rsa3JmTtwjT0zD_cb7P6Mm0OBQFo8GZB0yqfymKpHvraFOs-bTkVHGK8q2HKySMBXlOhYvZ3gMbUdktB_6CulW55C4Qj3rBvXdllh5_r_gAD/s800/005.png" /></a> <a href="http://feeds.feedburner.com/chenkgelate">GET UPDATE VIA RSS</a></div>

<div style="font-weight:bold; padding:10px 10px;">GET UPDATE VIA EMAIL</div>

<div style="padding-left:10px">Dapatkan kiriman artikel terbaru langsung ke email anda!</div>

<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=chenkgelate', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true"><div style="padding-left:10px; padding-bottom:10px; padding-top:10px"><input type="text" style="width:160px; height:18px" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Ketik email anda disini...&quot;;}" onfocus="if (this.value == &quot;Ketik email anda disini...&quot;) {this.value = &quot;&quot;}" type="text" value="Ketik email anda disini..." /> <input type="hidden" value=chenkgelate" name="uri" /><input type="hidden" name="loc" value="en_US" /><input class="button" type="submit" value="SUBCRIBE" /></div></form>

<div style="padding-left:10px"><a href="http://feeds.feedburner.com/chenkgelate"><img src="http://feeds.feedburner.com/~fc/chenkgelate?bg=ff7c00&amp;fg=444444&amp;anim=0" width="88" height="26" style="border:0" alt="" /></a></div>
</div></div>

Keterangan:
  • Ganti Tulisan yang berwarna Merah dengan alamat Feedburner sobat
  • Jika sobat mengerti kode HTML atau CSS Silahkan edit kode CSS ny

Udah dulu ya sobat blogger Tutorial Cara memodifikasi kotak Feedburner ala Chenkgelate. Capek nech mau Tidur dulu . .
Selamat Mencoba . . ! !

Kesalahan fatal dalam postingan blogger

Beberapa hari ini blog chenkgelate mengalami masalah pada postingan ny. Tidak tau knpa loading Home page pada Blog Ini sangaaaattttt Lambat . . .
Sampai" teman" dari blogroll saya ada yang bertanya "postingannya mana ne?" "blognya kog agak berat sob?"
Sudah berbagai cara saya lakukan untuk mengurangi loading page ny yang lama ini, namun tidak ada yg berhasil.
Tetapi ada satu hal yang membuat saya heran, ketika saya coba untuk membuka salah satu postingan saya yang lama, Lohh! Loading ny masih normal, disana saya bingung, Saya cobak membukak postingan saya yang baru-baru ini, disana terlihat postingan saya yang baru inilah yang sangat berat sehingga pada loading home page blog ini sangat berat..
selidik punya selidik akhirnya saya cobak untuk melihat" kembali kenapa bisa terjadi hal seperti ini. Mulai dari kata" dan gambar.
Akhirnya saya menemukan letak kesalahannya yang membuat loading home page saya lambat.
Intinya ada pada gambar dalam postingan saya...
saya baru ingat dalam minggu ini saya memasukkan postingan yang berupa gambar hanya dengan meng-copy gambar tersebut, (karna capek sob modemnya lola) dan langsung mengklik paste dan langsung saya publish.

Wah akhirnya saya tau bahwa format gambar yang saya copy secara langsung itu yang membuat loading blog saya sangat berat sob. (saya jgk gk tau sih knpa, maklum masih newbie sob) Yaudah, saya gk mau berlama-lama lagi akhirnya saya edit semua gambar pada postingan saya yang salah itu satu persatu sampai selesai.

  • Tips buat sobat Blogger
Jika sobat blogger ingin memasukkan postingan yang berupa gambar, diharapkan agar meng-upload gambar tersebut melalui fasilitas yang sudah di sediakan blogger (Liat SS nya yg di lingkari)

Cuma itu yang bisa saya sampaikan semoga sobat blogger smw bisa mengambil pelajarin dari hal tersebut.
semoga bermanfaat . .! !

Cara Membuat Daftar Isi Otomatis


Blog yang telah mempunyai banyak artikel dan kategori rugi bila menempatkan artikelnya di arsip blog. Cara ini tidak efektif untuk mempromosikan artikel dari blog tersebut. Nah, kali ini saya akan berbagi cara untuk mengatasi solusi tersebut. Solusinya adalah dengan menempatkan artikel-artikel tersebut pada widget daftar isi. Dengan widget ini visitors dapat mengetahui seluruh artikel di blog kita.

Ada bermacam-macam bentuk dari widget daftar isi. Kali ini saya akan membahas mengenai widget daftar isi yang dikelompokkan berdasarkan label. Widget ini dapat diletakkan di sidebar, postingan, maupun di halaman blog. Jadi widget ini dapat diletakkan dimana saja sesuai keinginan anda

Postingan kali ini akan membahas widget daftar isi yang dibuat oleh paman Abu-Farhan, seorang asal Indonesia yang ahli di bidang blogging. Ia pun telah terkenal hampir diseluruh penjuru dunia. Keahliannya menciptakan tutorial yang sangat sulit itulah yang membuat ia terkenal sampai sekarang. Nah, kali ini saya hanya mengedit widget hasil karya beliau.

Langkah-langkah :
1. Seperti biasanya, anda harus login ke akun blogger anda terlebih dahulu.
2. Karena widget ini dapat diletakkan disembarangan tempat, anda tinggal memilih tempatnya. Anda dapat meletakkan di gadget HTML/JavaScript, Postingan, atau Halaman.

Kode 1 :
Copy-paste kode dibawah pada tempat pilihanmu
<script style="text/javascript" src="http://mr-form.googlecode.com/files/D-IsiV1%28new%29.js"></script>
<script src="http://www.mrizki-form.co.cc/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
Keterangan :
- ganti www.mrizki-form.co.cc dengan alamat blog anda sendiri
- tampilannyanya akan ada tambahan kata 'New' pada 10 judul artikel terbaru

Kode 2
Copy-paste kode dibawah pada tempat pilihanmu
<script style="text/javascript" src="http://mr-form.googlecode.com/files/D-IsiV1%28baru%29.js"></script>
<script src="http://www.mrizki-form.co.cc/feeds/posts/default?max-results=9999&alt=json-in-script&callback=loadtoc"></script>
Keterangan :
- ganti www.mrizki-form.co.cc dengan alamat blog anda sendiri
- tampilannyanya akan ada tambahan kata 'Baru' pada 10 judul artikel terbaru.

Anda menggunakan source asli dari paman Abu-Farhan dengan cara mengganti kode berwarna merah tebal diatas dengan kode dibawah ini:
http://abu-farhan.com/script/daftarisibloggerarchive/tocbyarchivemin.js

Galaxy salah satu bukti kebesaran Allah SWT


Mari sejenak kita coolingdown, bertafakur memahami kebesaran Allah SWT melalui CiptaanNYA. Salah satunya tentang Galaxy. Galaxy terdiri dari milyaran bintang-bintang. (Bintang merupakan benda langit seperti halnya matahari. Namun bumi dan bulan bukan bintang). Terdapat sekitar tiga trilliun bintang dalam galaksi yang terbesar. Pada umumnya setiap galaksi berisi 200 hingga 300 milyar bintang, sementara galaksi kecil memiliki 100 milyar bintang.
Sekarang cobalah berpikir sejenak: apa artinya satu milyar untukmu? Jika kamu meletakkan dua nol setelah angka satu, akan menjadi 100. Jika kamu menambahkan satu nol lagi maka ia akan menjadi 1000. Tambahkan satu nol lagi, dan kamu memiliki angka 10,000 (sepuluh ribu). Dapatkah kamu berhitung sampai 10.000? Kamu pasti bisa, walau tentunya sangat lama. Tapi, kita masih belum mencapai angka satu milyar. Sekarang kita tambahkan dua nol lagi untuk 10,000. Sekarang menjadi 1,000,000 (satu juta). Kita baru sampai pada sedikit sekali jumlah bintang-bintang dalam sebuah galaksi. Namun, jika kamu menambahkan tiga nol lagi setelah 1,000,000, maka sampailah kita pada angka 1,000,000,000 (satu milyar). Dapatkah kamu berhitung sampai 1,000,000,000? Berhitung sampai satu milyar akan menghabiskan waktu beberapa dekade, satu dekade sama dengan sepuluh tahun.
Kini kita hampir mencapai jumlah bintang-bintang dalam galaksi. Jika kamu letakkan dua nol lagi setelah angka 1,000,000,000, ia akan menjadi 100,000,000,000 (seratus milyar). Ini adalah jumlah bintang didalam galaksi yang paling kecil.
Sudahkan terbayang olehmu mengenai ukuran alam semesta? Jika kamu menghabiskan hidupmu hanya untuk berhitung, tetap saja kamu masih akan gagal untuk menghitung semua bintang di angkasa. Allah, sang Pencipta alam semesta, telah menciptakan ruang angkasa yang tak terbayangkan luasnya olehmu dari sesuatu yang tak ada, dan Allah selalu mengawasi setiap titik di jagat raya ini. Allah mengetahui dan melihat semua yang ada di dalam alam semesta ini, berikut segala sesuatu yang terjadi di dalamnya. Al Qur’an menjelaskan Kekuatan Allah yang tak terbatas ini sebagai berikut:
… Allah mengetahui apa-apa yang ada di langit dan apa-apa yang ada di bumi. Dan Allah maha Kuasa atas segala sesuatu. (Surah Al ‘Imran: 29)
Sekarang ayo kita coba kembali untuk mempelajari galaksi lebih lanjut.
Dalam setiap galaksi terdapat pusat galaksi. Di sekeliling pusat galaksi terdapat lengan yang berputar dengan kecepatan yang luar biasa. Lengan ini terdiri atas bintang-bintang, gas dan awan debu.
Galaksi, dengan pusat galaksi dan lengannya, menjadi benda langit yang terbesar di angkasa. Benda langit ini juga membentuk gugusan galaksi. Didalamnya terdapat ribuan galaksi. Selanjutnya, gugusan-gugusan galaksi tersebut membentuk kumpulan gugusan benda langit. Gugusan-gugusan ini semakin besar dan terus membesar.
Sekarang perhatikan apa saja yang telah kita ketahui:
  • Galaksi terdiri atas milyaran, bahkan trilliunan bintang-bintang;
  • Setiap galaksi memiliki pusat galaksi;
  • Galaksi memiliki lengan yang terdiri atas bintang-bintang, gas dan awan debu yang berputar mengelilingi pusat galaksi dengan kecepatan tinggi.
  • Galaksi-galaksi secara bersama-sama membentuk gugusan galaksi. Bahkan terdapat hampir ribuan galaksi yang membentuk gugusan tersebut. Gugusan-gugusan galaksi juga bersama-sama membentuk gugusan-gugusan lagi.
Ingatlah bahwa sebuah galaksi kecil memiliki 100 milyar bintang-bintang yang besarnya belum tentu sebesar matahari. Selain itu, terdapat planet yang besar dan kecil seperti halnya bumi kita yang berputar mengelilingi bintang-bintang tersebut.
Sekarang coba perhatikanlah. Dapatkah milyaran bintang berkumpul bersama dengan teratur secara kebetulan? Dapatkah bintang-bintang memunculkan sebuah keteraturan yang memungkinkannya bergerak tanpa bertabrakan dengan benda-benda langit lainnya (misalnya bumi kita dengan planet-planet yang lain)?
Nyatanya tidaklah demikian. Semua memperlihatkan bahwa perputaran dan pergerakan bintang-bintang dengan kecepatan tinggi tanpa bertabrakan dengan benda langit lainnya sejak saat pertama keberadaanya merupakan tanda dari keberadaan Alah Sang Pencipta, Sang Perencana, Sang Pengatur, Yang Mengatur Alam Semesta. Allah telah membuat jalur bagi setiap planet, bintang, dan komet di angkasa. Mereka semua berada di jalurnya masing-masing tanpa bertabrakan dengan yang lainnya.
Bagaimana, sekarang kita bisa tahu betapa kecilnya bumi yang kita diami ini, betapa kecilnya kita manusia ini, bahkan untuk menghitung ciptaan Allah saja kita tidak akan sanggup.
Dan jika kamu menghitung-hitung nikmat Allah, niscaya kamu tak dapat menentukan jumlahnya. Sesungguhnya Allah benar-benar Maha Pengampun lagi Maha Penyayang.(QS .16:18 )
Kalau demikian sebenarnya, mengapa ada orang yang sombong ? apa yang patut kita sombongkan ?, lihatlah kelangit dan pahami betapa kecilnya kita.
Referensi :  GLORY IN THE HEAVENS – Harun Yahya
Semoga bermanfaat.

Membuat Link Berwarna Pelangi

Ingin membuat link pada blog anda berkedip dan berwarna pelangi ketika tersentuh pointer? Caranya sangat mudah

Dalam keadaan loggin,

Masuk pada menu template,

Klik Edit HTML,

Kemudian copy code berikut dan paste tepat diantara kode </head> dan <body>

<script src='http://hermanblog.googlecode.com/files/link_pelangi.js'/>

Terakhir simpan template.

Selamat mencoba!

Cara membagi dua kolom kategori/labels blogger

Pada postingan yang terdahulu banget, saya pernah memsoting tentang cara membuat labels/kategori di blogspot yang berguna untuk memudahkan pengunjung blog kita menjelajahi isi dari blog itu sendiri, betul tidak teman - teman? hehehe :D. Namun pada pilihan Display widget kategori/labels yang berbentuk daftar (list) terdapat kelemahan. Kelemahan dari display tersebut adalah apabila blog kita mempunyai banyak kategori maka widget kategori/labels tersebt akan sangat panjang kebawah dan akan memakan tempat yang banyak, maka dari itu saya akan berbagi cara untuk mengatasi masalah tersebut, Gimana caranya sobat? Mudah teman, lihat aja yuk kebawah!
  1. Login ke blogger
  2. Masuk Rancangan >> Edit HTML (saya berasumsi kamu sudah mempunyai widget Kategori/labels)
  3. setelah melakukan langkah diatas, maka kamu harus mencari kode ]]></b:skin> dan tambahkan kode di bawah ini tepat di atasnya
    #Label1 li { float:left;width:45%;} 
  4. Keterangan :
  5. teks width:45% itu menunjukan lebar perkolom kategori tersebut, jadi kamu bisa sesuaikan dengan lebar tempat menaruh widget tersebut ya, oiya nilai dari width tersebut juga bisa dalam bentuk pixel.

  6. Setelah itu simpan dan lihat hasilnya

Sekarang tidak ush khawatir lagi klo widget kategori/labels memakan tempat blog kamu.  Mungkin itu saja yang bisa saya sampaikan, kurang lebihnya mohon maaf kawan :) see you.

Membuat Artikel Terkait / Related Post di Blogger

related_posts_widget Untuk membuat artikel terkait atau related post, kita akan sedikit mengubek-ubek kode HTML template kita. Jadi seperti biasa saya sarankan untuk membackup template sobat terlebih dahulu sebelum membuat artikel terkait ini.

Buat blogger baru yang belum mengerti tentang artikel terkait akan saya beri sedikit gambaran, kurang lebihnya seperti ini, dalam setiap postingan tentunya kita akan mengelompokkan postingan kita dalam beberapa kelompok atau yang biasa disebut dengan label (kategori).

Artikel terkait itu biasanya yang saya tau selalu berada dalam 1 kelompok postingan yang di kategorikan, dan umumnya diletakkan di bagian bawah postingan.

Berikut tutorial singkatnya :

  1. Login ke Blogger.
  2. Klik Tata Letak.
  3. Klik tab Edit HTML.
  4. Kemudian klik Expand Template Widgets .
  5. Cari kode yang seperti ini :

    <p><data:post.body/></p>

    atau jika bingung tekan Ctrl + F kemudian ketikkan kode berikut :

    <data:post.body/>
  6. Jika sobat sudah menggunakan read more pada template sobat, maka akan terdapat 2 kode <data:post.body/>.
  7. Kemudian letakkan script berikut ini setelah kode <data:post.body/> yang pertama.

    <b:if cond='data:blog.pageType == "item"'>
    <div class='similiar'>

    <div class='widget-content'>
    <h3>Artikel Terkait</h3>
    <div id='data2007'/><br/><br/>
    <script type='text/javascript'>

    var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
    var maxNumberOfPostsPerLabel = 4;
    var maxNumberOfLabels = 7;

    maxNumberOfPostsPerLabel = 7;
    maxNumberOfLabels = 3;


    function listEntries10(json) {
    var ul = document.createElement(&#39;ul&#39;);
    var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
    json.feed.entry.length : maxNumberOfPostsPerLabel;
    for (var i = 0; i &lt; maxPosts; i++) {
    var entry = json.feed.entry[i];
    var alturl;

    for (var k = 0; k &lt; entry.link.length; k++) {
    if (entry.link[k].rel == &#39;alternate&#39;) {
    alturl = entry.link[k].href;
    break;
    }
    }
    var li = document.createElement(&#39;li&#39;);
    var a = document.createElement(&#39;a&#39;);
    a.href = alturl;

    if(a.href!=location.href) {
    var txt = document.createTextNode(entry.title.$t);
    a.appendChild(txt);
    li.appendChild(a);
    ul.appendChild(li);
    }
    }
    for (var l = 0; l &lt; json.feed.link.length; l++) {
    if (json.feed.link[l].rel == &#39;alternate&#39;) {
    var raw = json.feed.link[l].href;
    var label = raw.substr(homeUrl3.length+13);
    var k;
    for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
    var txt = document.createTextNode(label);
    var h = document.createElement(&#39;b&#39;);
    h.appendChild(txt);
    var div1 = document.createElement(&#39;div&#39;);
    div1.appendChild(h);
    div1.appendChild(ul);
    document.getElementById(&#39;data2007&#39;).appendChild(div1);
    }
    }
    }
    function search10(query, label) {

    var script = document.createElement(&#39;script&#39;);
    script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
    + label +
    &#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
    script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
    document.documentElement.firstChild.appendChild(script);
    }

    var labelArray = new Array();
    var numLabel = 0;

    <b:loop values='data:posts' var='post'>
    <b:loop values='data:post.labels' var='label'>
    textLabel = &quot;<data:label.name/>&quot;;

    var test = 0;
    for (var i = 0; i &lt; labelArray.length; i++)
    if (labelArray[i] == textLabel) test = 1;
    if (test == 0) {
    labelArray.push(textLabel);
    var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
    labelArray.length : maxNumberOfLabels;
    if (numLabel &lt; maxLabels) {
    search10(homeUrl3, textLabel);
    numLabel++;
    }
    }
    </b:loop>
    </b:loop>
    </script>
    </div>

    </div>
    </b:if>

  8. Kemudian Save Template.
Untuk membuat artikel terkait versi II, silahkan sobat baca postingan saya tentang cara memasang artikel terkait di sidebar. Selamat mencoba !

Menambahkan Effect JQuery Link Nudging Pada Tabel

JQuery link nudging adalah effect animasi pada link hasil dari penambahan padding kiri, effect ini akan nampak saat kita menyentuhkan pointer/mouse  pada link, link akan bergerak kekanan atau bergoyang. Seru juga jadinya, tertarik ingin menerapkan JQuery Link Nudging pada blog sobat? Silahkan ikuti tutorial berikut atau terlebih dahulu silahkan lihat demo effect JQuery link nudging pada tabel di blog ini

1. Setelah sig in pada account blogger sobat>>> pada dasbor>>> Klik Rancangan>>> Edit HTML

2. Tambahkan Script JQuery berikut diatas kode </head>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script>

Catatan: abaikan langkah kedua bagi sobat yang sudah menginstal script JQuery diatas pada template blogger sobat.

3. Tambahkan lagi script berikut dibawah script JQuery tadi:

<script type='text/javascript'>
$(document).ready(function() {
$(&#39;#Label1 li&#39;).hover(function() { //mouse in
$(this).animate({ marginLeft: &#39;12px&#39; }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});
</script><!-- end LinkNudging -->

4. Simpan, dan lihat hasilnya pada blog sobat.

Mudah bukan? Selamat mencoba, semoga berhasil dan bermanfaat.

Membuat Related post / Artikel terkait

Pengertian Related Post atau Artikel Terkait adalah posting atau artikel yang berhubungan dengan artikel lainnya berdasarkan atas kesamaan nama kategori atau label postingan, tetapi artikel tersebut tidak selalu sama topiknya, bisa juga membahas tentang hal lain, tetapi masih mempunyai relevansi dengan tujuan artikel tersebut, misalnya yang sedang anda baca sekarang adalah artikel dengan judul Cara Membuat Artikel Terkait (Related Post) Di Blogspot, kemudian terkait dengan artikel lain yang berjudul Cara Mengganti Header Blog pada Blogger, disini kesamaannya adalah artikel tersebut sama-sama membahas tentang blog.

Oleh karena itu jika hendak memasukan kategori atau label pada postingan sebaiknya betul-betul diperhatikan apakah postingan tersebut mempunyai relevansi dengan postingan lainnya atau tidak, apabila tidak sebaiknya dibuatkan kategori atau label baru saja, tujuannya supaya pembaca blog kita tidak kecewa.

OK, sekarang kita mulai mengulas tentang Cara Pasang Artikel Terkait (Related Post) pada Blogspot, silahkan ikuti langkah-langkah di bawah ini :

  1. Login ke account blogger Anda.
  2. Pilih menu Tata Letak/Layout » Edit HTML.
  3. Beri tanda centang pada tulisan Expand Widget Templates.
  4. Copy-paste script berikut di atas kode </head>:

    <script type="text/javascript">
    //<![CDATA[
    var relatedTitles = new Array();
    var relatedTitlesNum = 0;
    var relatedUrls = new Array();
    function related_results_labels(json) {
    for (var i = 0; i < json.feed.entry.length; i++) {
    var entry = json.feed.entry[i];
    relatedTitles[relatedTitlesNum] = entry.title.$t;
    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'alternate') {
    relatedUrls[relatedTitlesNum] = entry.link[k].href;
    relatedTitlesNum++;
    break;
    }
    }
    }
    }
    function removeRelatedDuplicates() {
    var tmp = new Array(0);
    var tmp2 = new Array(0);
    for(var i = 0; i < relatedUrls.length; i++) {
    if(!contains(tmp, relatedUrls[i])) {
    tmp.length += 1;
    tmp[tmp.length - 1] = relatedUrls[i];
    tmp2.length += 1;
    tmp2[tmp2.length - 1] = relatedTitles[i];
    }
    }
    relatedTitles = tmp2;
    relatedUrls = tmp;
    }
    function contains(a, e) {
    for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
    return false;
    }
    function printRelatedLabels() {
    var r = Math.floor((relatedTitles.length - 1) * Math.random());
    var i = 0;
    document.write('<ul>');
    while (i < relatedTitles.length && i < 20) {
    document.write('<li><a href="' + relatedUrls[r] + '">' +
    relatedTitles[r] + '</a></li>');
    if (r < relatedTitles.length - 1) {
    r++;
    } else {
    r = 0;
    }
    i++;
    }
    document.write('</ul>');
    }
    //]]>
    </script>
  5. Kemudian cari kode berikut:

    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
    </b:loop>
    </b:if>
  6. Setelah itu tambahkan kode berwarna merah di antara kode yang berwarna biru hingga menjadi seperti di bawah ini:

    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>


    <b:if cond='data:blog.pageType == "item"'>
    <script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
    </b:if>

    </b:loop>
    </b:if>
  7. Kemudian letakkan kode berwarna merah di bawah kode ini: </b:loop></b:if>, contohnya seperti di bawah ini:

    </b:loop>
    </b:if>


    <b:if cond='data:blog.pageType == "item"'>
    <h4>Artikel Terkait</h4>
    <script type="text/javascript">
    removeRelatedDuplicates();
    printRelatedLabels();
    </script>
    </b:if>
  8. Simpan Template, Selesai.

Cara Membuat Scroll Keatas Secara Otomatis


Caranya gampang ko....

kamu Copy Paste aja script di bawah ini :

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>


<script src="http://raezen.fileave.com/scrolltop.js" type="text/javascript"></script>

kalau sudah di "Copy",, kamu "Paste" persis dibawah kode : <head>

Selesai ^_^

Blogger Template SimCleanear (Simple Clean & Clear)

Bismillah. Alhamdulillah... Satu template telah selesai dibuat oleh Blogger Tune-Up. Sebenarnya kurang begitu percaya diri Blogger Tune-Up mengeluarkan template untuk Blogger karena merasa bukanlah ahli apalagi spesialis template blogger. Tapi tidak ada salahnya untuk mencoba mengeluarkan satu template yang dirancang oleh Blogger Tune-Up sebagai persembahan kepada para pembaca setia Blogger Tune-Up dan sekaligus ucapan terima kasih atas kesetiaannya untuk selalu berkunjung dan mendukung keberadaan Blogger Tune-Up. Selalu menyimak artikel demi artikel dan memberikan komentar-komentar membangun yang mampu memotivasi Blogger Tune-Up untuk terus berkarya dan menulis tips dan trik yang lebih baik. Membuat plugin-plugin jQuery yang lebih sempurna dan sederhana adalah keinginan Blogger Tune-Up dengan harapan para Blogger Indonesia mampu menunjukan pada dunia bahwa kita memiliki kelas sendiri yang unik dan berkwalitas.

Halaman Depan Blogger Template SimCleanear
Blogger Template Simple Clean & Clear ini merupakan hasil rancang bangun Blogger Tune-Up yang dipersembahkan secara gratis untuk seluruh blogger Indonesia pada umumnya dan pembaca setia Blogger Tune-Up pada khususnya. Lalu apa keutamaan (feature) yang disuguhkan dari Blogger Template Simple Clean & Clear ini?
Halaman Artikel Blogger Template SimCleanear

Keutamaan (feature) Blogger Template Simple Clean & Clear

  • Dari namanya bisa kita tebak yaitu sebuah template yang menyuguhkan kesederhanaan, kebersihan dan kemudahan
  • Karakternya sederhana tapi profesional
  • Sedikit sekali melibatkan gambar sehingga proses loading halaman lebih cepat
  • Cocok untuk blog yang berkarakter index, sitemap atau berupa daftar isi
  • Tabel sederhana yang sangat elegan dan profesional (tambahan)
  • Menggunakan framework jQuery dan JSON
  • jQuery Auto Image Caption yang secara otomatis membuat frame untuk gambar (tambahan)
  • jQuery Slick Tab yang membuat tampilan bawah artikel terlihat sederhana dan profesional
  • Terintegrasi fasilitas artikel terkait tanpa harus mengutak-atik kodenya lagi
  • Terintegrasi tombol berbagi yang mampu menghubungkan dan membagikan artikel kita pada berbagai layanan feed dan jejaring sosial
  • Terdiri dari 3 kolom dengan 2 sidebar kiri dan kanan
  • Terdiri dari 2 kolom footer yang cocok dan dirancang khusus sebagai tempat iklan
  • Terintegrasi statistik pengunjung yang sedang online, tombol bookmark, tanggal, dan fasilitas pencarian

Ketentuan Penggunaan Blogger Template Simple Clean & Clear

  • Template ini dibuat oleh Blogger Tune-Up di bawah lisensi Creative Commons Attribution 3.0
  • Tersedia dengan gratis tanpa harus membelinya atau tukar guling dengan apapun
  • Anda dapat menggunakan dan memodifikasinya sesuai keperluan anda tanpa batasan
  • Tidak diperkenankan membuang tautan kredit pada bagian bawah template dengan alasan apapun kecuali mendapat persetujuan dari Blogger Tune-Up sesuai perjanjian yang dibuat selanjutnya
  • Blogger Tune-Up tidak bertanggung jawab atas kerusakan atau kesalahan yang terjadi kedepannya akibat dari penggunaan template ini
  • Blogger Tune-Up tidak bertanggung jawab jika suatu hari ada pihak yang menggugat anda karena penggunaan template ini

Tata Cara Penggunaan Blogger Template Simple Clean & Clear

Pada tata cara penggunaan Blogger Template Simple Clean & Clear ini tidak akan dijelaskan secara mendetail langkah demi langkah, karena kami anggap anda sudah memahami atau pernah membaca artikel-artikel dari Blogger Tune-Up
1) Menambahkan SEO Tag Meta
Cari kode dibawah ini:
<title><data:blog.pageTitle/></title>

Kemudian ganti (replace) dengan kode dibawh ini:
<b:if cond='data:blog.pageType == &quot;index&quot;'>

<title><data:blog.pageTitle/></title>

<b:else/>

<title><data:blog.pageName/> | Nama Blog atau Alamat Blog</title>

</b:if>

<meta content='index,follow' name='robots'/>

<meta content='en' name='language'/>

<b:if cond='data:blog.pageType != &quot;item&quot;'>

<meta content='ganti dengan deskripsi blog' name='description'/>

<meta content='keyword1, keyword2, dan seterusnya' name='keywords'/>

<b:else/>

<meta expr:content='data:blog.pageName + &quot;keyword1, keyword2, dan seterusnya&quot;' name='keywords'/>

</b:if>

Keterangan: kata yang diblok silahkan disesuaikan dengan blog

2) Mengubah Logo
Cari kode dibawah ini:
#wrap {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBx34HaUttMdd1Ny4YBaLyBLEB0cYQ30WT96F5Whh0HOhMJazIcVC5Ea4gS7G0gvK6XBGws-roK6WZLKtBs9t7esJBfMV_UtnDunhs1dKAZP_XDJkclZcSPRs-kxAPtBN16H84BgADQ8Y/d/logo.gif) no-repeat scroll right 5px #fff;margin:0 auto;width:940px;}

Ubah/ganti alamat URL dibawah ini sesuai dengan logo yang sudah anda buat:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBx34HaUttMdd1Ny4YBaLyBLEB0cYQ30WT96F5Whh0HOhMJazIcVC5Ea4gS7G0gvK6XBGws-roK6WZLKtBs9t7esJBfMV_UtnDunhs1dKAZP_XDJkclZcSPRs-kxAPtBN16H84BgADQ8Y/d/logo.gif
Keterangan : ukuran logo 148 px X 156 px

3) Mengganti Link Bookmark
Cari kode dibawah ini:
var bookurl="http://URL.com/"

var bookname="Nama Blog"

Ganti URL dan Nama Blog sesuai blog anda

4) Mengubah Judul Tab Link
Cari kode dibawah ini:
<div id='tabs'>

<a expr:href='data:blog.homepageUrl' id='this'>Home</a>

<a href='URL'>Edit Link</a>

<a href='URL'>Edit Link</a>

</div>

Ganti URL sesuai dengan alamat dan Edit Link sesuai nama tab, misal:
<a href='http://namablog.blogspot.com/'>Blog Lainku</a>


5) Mengaktifkan Statistik Pengunjung
Cari kode dibawah ini:
<script src='http://fastonlineusers.com/on2.php?d=URL.com' type='text/javascript'/>

Ganti URL sesuai dengan alamat blog, misal:
namablog.blogspot.com
Keterangan: URL tanpa "htpp://"

6) Memasukan Iklan Link
Cari kode dibawah ini:
<div class='iklanlink'><!-- Iklan Link --></div>

<data:post.body/>

<div class='iklanlink'><!-- Iklan Link --></div>

Ubah/ganti kode dibawah ini:
<!-- Iklan Link -->
Dengan iklan link misal seperti contoh dibawah ini:
&lt;script type=&quot;text/javascript&quot;&gt;&lt;!--

google_ad_client = &quot;pub-2925834362764225&quot;;

google_ad_host = &quot;pub-1556223355139109&quot;;

google_ad_host_channel=&quot;00000&quot;;

/* 468x15 BonProg */

google_ad_slot = &quot;3625572682&quot;;

google_ad_width = 468;

google_ad_height = 15;

//--&gt;

&lt;/script&gt;

&lt;script src=&quot;http://pagead2.googlesyndication.com/pagead/show_ads.js&quot; type=&quot;text/javascript&quot;&gt;

&lt;/script&gt;

Keterangan: Kode iklan harus di encode

7) Mengubah Judul jQuery Slick Tab
Cari kode dibawah ini:
<ul class='slick'>

<li><a class='slick active' href='#terkait' title='content_1'>Related Posts</a></li>

<li><a class='slick' href='#comments' title='content_2'>Comments</a></li>

<li><a class='slick' href='#share' title='content_3'>Share</a></li>

</ul>

Ubah/ganti bagian yang diblok sesuai dengan keinginan

8) Edit Iklan Footer
Hal ini dilakukan jika anda menghapus Gadget HTML bawaan, maka harus ditambahkan lagi kode pada template supaya tampilan kembali normal. Jika tidak di edit dan ditambahkan kode maka tampilan footer ini tidak menarik. Untuk mengedit kode harus dalam mode "Edit HTML - Expand Template Widget"
Cari kode dibawah ini (ini kode bawaan template) dan perhatikan yang di blok:
<div id='iklan'>

<b:section class='iklankiri' id='iklan1' preferred='yes'>

<b:widget id='HTML14' locked='false' title='' type='HTML'>

<b:includable id='main'>

<!-- only display title if it's non-empty -->

<b:if cond='data:title != &quot;&quot;'>

<h2 class='title'><data:title/></h2>

</b:if>

<div class='widget-content sideadsl'>

<data:content/>

</div>


<b:include name='quickedit'/>

</b:includable>

</b:widget>

</b:section>

<b:section class='iklankanan' id='iklan2' preferred='yes'>

<b:widget id='HTML15' locked='false' title='' type='HTML'>

<b:includable id='main'>

<!-- only display title if it's non-empty -->

<b:if cond='data:title != &quot;&quot;'>

<h2 class='title'><data:title/></h2>

</b:if>

<div class='widget-content sideadsr'>

<data:content/>

</div>


<b:include name='quickedit'/>

</b:includable>

</b:widget>

</b:section>

</div>

Jika anda menghapus gadget tadi dan kemudian menambahkan baru maka kode kembali normal seperti dibawah ini:
<div class='widget-content'>

Tambahkan kode sideadsr untuk footer sebelah kanan dan sideadsl untuk footer sebelah kiri sehingga menjadi:
<div class='widget-content sideadsl'>

<div class='widget-content sideadsr'>


9) Menonaktifkan Fungsi Tanggal
Jika tampilan blog anda seperti dibawah ini:
- Nonaktifkan fungsi tanggal melalui "Rancangan - Elemen Laman" klik link edit pada "Posting Blog"
- Halaman "Mengkonfigurasi Posting Blog" akan terbuka lalu cari "Opsi Laman Entri"
- Hilangkan tanda check pada opsi tanggal bagian atas
- Klik tombol "SIMPAN"
Demo Template SimCleanearKlik disini untuk Demo Blogger Template Simple Clean & Clear
Download Template SimCleanearKlik disini untuk download Blogger Template Simple Clean & Clear

Menggunakan Fasilitas Tambahan Blogger Template Simple Clean & Clear

1) Tabel
Selain perlengkapan standar, template simcleanear juga dilengkapi dengan fasilitas tabel yang sangat elegan.
Dibawah ini contoh kode tabel :
<table class="dl1" id="dl1">

<tbody>

<tr><th id="na">Informasi</th><th width="300">Keterangan</th></tr>

</tbody>

</table>


<table class="dl2" id="dl2">

<col/><col width="10"/>

<col width="300"/>

<tbody>

<tr><td>Nama</td><th>:</th><th>Blogger Template Simple Clean & Clear</th></tr>

<tr><td>Versi</td><th>:</th><th>Versi 1.0</th></tr>

<tr><td>Sistem Operasi</td><th>:</th><th>Win XP, Win Vista, Win 7</th></tr>

<tr><td>Password</td><th>:</th><th>-</th></tr>

<tr><td>Website Resmi</td><th>:</th><th><a href="http://programgratisan.blogspot.com/" target="_blank">Program Gratisan</a></th></tr>

<tr><td>Tanggal Rilis</td><th>:</th><th>18 Maret 2011</th></tr>

<tr><td>Ukuran File</td><th>:</th><th>42.8 Kb</th></tr>

<tr><td>Unduh</td><th>:</th><th>[<a href="http://modification-blog.blogspot.com/" target="_blank" rel="nofollow">Rekomendasi</a>]-[<a href="http://bonprog.blogspot.com/" target="_blank" rel="nofollow">Link 1</a>]-[<a href="http://programgratisan.blogspot.com/" target="_blank" rel="nofollow">Link 2</a>]</th></tr>

</tbody>

</table>

Dibawah ini preview hasil akhir tabel:

2) jQuery Auto Image Caption
Selain dilengkapi tabel, template Simcleanear dilengkapi fasilitas jQuery Auto Image Caption yaitu fasiitas yang secara otomatis menambahkan border dan keterangan pada gambar, seperti dibawah ini:
Penambahan kode (yang diblok) pada gambar:
<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKfcTZ11TcZvZohHBigelk_w8QK8Kpfl6lBw4p746OiJb7FvRnbUMykdA3rL1P_aqdRwXFvd7xdLm-1i61C3fEBDuK4LB1U6zjvPpWbxtbT0kCz1bOJM3tu7eQ3BH39OaW_uy5AbrrzLf0/s400/jQuery-Auto-Image-Caption.jpg">
<img class="gambar" style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 400px; height: 222px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKfcTZ11TcZvZohHBigelk_w8QK8Kpfl6lBw4p746OiJb7FvRnbUMykdA3rL1P_aqdRwXFvd7xdLm-1i61C3fEBDuK4LB1U6zjvPpWbxtbT0kCz1bOJM3tu7eQ3BH39OaW_uy5AbrrzLf0/d/jQuery-Auto-Image-Caption.jpg" border="0" alt="jQuery Auto Image Caption" id="BLOGGER_PHOTO_ID_5484533350455173970" />
</a>
Lebih lengkapnya silahkan baca disini.

Selamat mencoba dan terima kasih atas segala apresiasinya terhadap Blogger Tune-Up. Happy Blogging :)
 
Support : Your Link | Your Link | Your Link
Copyright © 2013. Portal Editing - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger