Memasang Scroll di Blog Archive Bawaan Blogger

Beberapa waktu lalu saya pernah memposting bagaimana cara memasang Scroll Box Daftar Isi di sidebar dengan widget tambahan. Dan kali saya akan berbagi pengetahuan tetap pada topik yang sama, namun bedanya kali ini kita memasang scroll di arsip blog bawaan blogger. Tanpa banyak basa-basi lagi, langsung saja ikuti langkah dibawah :

• Tambahkan widget arsip blog, simpan dengan judul misal Arsip Blog/Blog Archive atau apa sajalah terserah anda.
• Simpan/save penambahan widget tersebut. Nah, sampai disini anda telah menambahkan Arsip pada blog anda (tanpa fungsi scroll).
• Kemudian, untuk memasang/menambahkan fungsi scroll pada Arsip, klik Tata letak/Layout > Edit HTML > beri tanda centang pada Expand Template Widgets.
• Selanjutnya cari Arsip Blog yang sudah dibuat tadi, gunakan CTRL+F dan ketikkan kata “Arsip” agar lebih cepat, kemudian akan muncul kode html seperti berikut :

<b:widget id='BlogArchive2' locked='false' title='Arsip' type='BlogArchive'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2><data:title/></h2>
</b:if>
<div class='widget-content'>
<div style='overflow:auto; width:ancho;height:200px;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div></div>
<b:include name='quickedit'/>
</div>
</b:includable>

• Perhatikan kode yang di tandai warna merah (<div style='overflow:auto; width:ancho;height:200px;'>) dan (</div>) di atas. Kode itulah yang harus disisipkan kedalam script arsip yang telah anda buat tadi. Dan untuk kode yang berwarna biru (height:200px;) untuk mengatur tinggi fungsi scroll, silahkan anda ganti angka 200 sesuai keinginkan anda.
• Simpan/Save template dan silahkan lihat hasilnya.

Selamat mencoba...!!

Related Post :

tutorial

• Tips SEO untuk Pemula
• Cara Menghapus Link Aktif di Kotak Komentar
• Mengatasi Pesan Komentar yang Pindah ke Bawah
• Membuat Menu Tab View Tanpa Edit HTML
• Menampilkan Foto Profil pada Komentar Blog
• Membuat Semua Label Breadcrumbs Terindex Google
• Cara Agar Breadcrumbs Terindex Google bag.2
• Pagerank bulan November 2012
• Cara Membuat Tombol Back to Top
• Membuat Fan Page Melayang di Blog ver.2

tutorial blog

• Cara Menghapus Link Aktif di Kotak Komentar
• Mengatasi Pesan Komentar yang Pindah ke Bawah
• Membuat Menu Tab View Tanpa Edit HTML
• Menampilkan Foto Profil pada Komentar Blog
• Membuat Semua Label Breadcrumbs Terindex Google
• Cara Agar Breadcrumbs Terindex Google bag.2
• Pagerank bulan November 2012
• Cara Membuat Tombol Back to Top
• Membuat Fan Page Melayang di Blog ver.2
• Cara Membuat Effect Kembang Api di Blog