Cara Membuat Fungsi Scroll Pada Arsip Blog

Mungkin kita pernah melihat sebuah blog yang memiliki widget pada Arsip Blog atau Bahasa Jawanya "Blog Archive" telah banyak memakan ruang pada template-nya. Selain karena blog tersebut sudah banyak memposting artikel juga disebabnya karena widget Arsip blog tersebut telah diset untuk tampil jumlah entri serta list judulnya.
Lalu bagaimana solusinya agar judul artikel tetap ditampilkan oleh widget Arsip namun tanpa harus menghabiskan ruang kosong pada template?

Nah, salah satunya adalah yang akan kita bahas ini. Yaitu membuat fungsi scrool pada Arsip blog.  Dengan cara ini hal semacam tadi mungkin bukan jadi masalah lagi.

Contoh scroll pada Arsip blog gambarannya seperti apa bisa kalian lihat seperti dibawah ini :

2013 (8)
April (3)

• Tutorial Bergambar Cara Membuat Dedek
• Info Lowongan Kerja Tahun 2009
• Kumpulan Nomor Jitu Togel SGP

Maret (3)

• Tutorial Lengkap Merakit Bom
• Tutorial Membuat Gerobak Bakso
• Tips Jitu Agar Diterima Menjadi Menantu Bos

Februari (2)

• Cara Meluruskan Rambut Krebo
• Tips Agar Cepat Kurus Kering

Langkah-langkah membuatnya seperti ini :
1. Login di Blogspot
2. Pergi ke menu setting "Template"
3. Backup template terlebih dulu sebelum merubah kodenya, caranya baca disini
4. Selesai bacup klik "Edit HTML"

5. Cari kode yang seperti ini  <div id='ArchiveList'>

Lebih lengkap lagi kodenya seperti dibawah ini :

<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>
<b:include name='quickedit'/>

6. Jika sudah ketemu tambahkan kode dibawah ini kedalamnya.

<div style='overflow: auto; width: ancho; height: 350px;'> dan tag penutupnya </div>

Sehingga keseluruhan kodenya akan menjadi seperti ini :

<div style='overflow: auto; width: ancho; height: 350px;'>
<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'/>

*Keterangan :
Kode yang saya beri tanda warna merah (juga biru) adalah kode yang harus ditambahkan
Kode warna biru menyatakan ukuran tinggi widget scroll arsip, yaitu 350px. Bisa kalian sesuaikan pada template blog masing-masing

7. Semua sudah beres tinggal diklik "Simpan template"

Ceritakan ini di :

Facebook Google+ Twitter Digg

Tentang Penulis :

Ansory Esce
Dia bukanlah seseorang yang memiliki segudang ilmu untuk bisa diceritakan. Bukan juga seorang Blogger profesional yang bisa menggurui kalian tentang ilmu Blogging atau tentang ilmu Internet lainnya. Dia hanyalah seorang Blogger "alakadarnya" yang memiliki keterbatasan pengetahuan. Menulis di Blog ia lakukan sekedar untuk mengenal banyak teman baru serta sebagai media untuk belajar dan saling berbagi. Selengkapnya..
Berteman dengannya di: Facebook | Twitter | Google+