Cara membuat blog archive agar bisa di Gulir / fungsi scroll

Pada kesempatan kali ini saya akan share suatu trik blogger yaitu cara memasang fungsi scroll pada blog archive pada blogger langsung aja ikuti langkah - langkah berikut ini

1. langkah pertama Login ke blog sobat
2. Pilih Design dan Edit Hmtl
3. Kemudian sobat Cari kode berikut <b:includable id='main'> agar cepat tekan F3
4. Setelah sobat temukan kode tersebut. sekarang perhatikan kode berikut.
   
   <b:includable id='main'>
   <b:if cond='data:title'>
   <h2><data:title/></h2>
   </b:if>
   <div class='widget-content'>
   <div id='ArchiveList'>
   
5. Pada deretan kode diatas yang berwarna merah tambahkan style='overflow:auto; height:120px' sehingga lengkapnya seperti ini <div class='widget-content' style='overflow:auto; height:120px'>
6. Selanjutnya save template dan lihat hasilnya.

Begitu muda bukan,sekarang giliran sobat yang mencoba. Nah yang di atas itu buat pasang scroll di blog archive sedangkan yang berikut ini cara pasang scroll pada label atau category bisa di sebut juga taq langsung aja sobat,

1. Login ke blogger dengan ID sobat tentunya.
   
2. Buatlah Label dengan menambah Gadget pada sidebar, jangan lupa beri judul.
   
3. Anggap saja sobat telah membuat judul labelnya dengan nama “Kategori”.
   
4. Sekarang tuju ke Edit HTML.
   
5. Klik Expand Template Widgets.
   
6. Cari label yang sudah sobat buat tadi, dengan CTRL+F dan ketikkan “Kategori”, maka akan muncul kode HTML yang ribet, tapi jangan pusing melihat kode HTML tersebut.
   
7. Perhatikan saja tulisan yang berwarna merah dibawah ini, kode itulah yang harus disisipkan kedalam label yang sudah sobat buat.
   
   
   <b:widget id='Label1' locked='false' title='Kategori' type='Label'>
   <b:includable id='main'>
   <b:if cond='data:title'>
   <h2><data:title/></h2>
   </b:if>
   <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
   <div style='overflow:auto; width:ancho; height:250px;'>
   <b:if cond='data:display == &quot;list&quot;'>
   <ul>
   <b:loop values='data:labels' var='label'>
   <li>
   <b:if cond='data:blog.url == data:label.url'>
   <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
   <b:else/>
   <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
   </b:if>
   <b:if cond='data:showFreqNumbers'>
   <span dir='ltr'>(<data:label.count/>)</span>
   </b:if>
   </li>
   </b:loop>
   </ul>
   <b:else/>
   <b:loop values='data:labels' var='label'>
   <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'>
   <b:if cond='data:blog.url == data:label.url'>
   <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
   <b:else/>
   <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
   </b:if>
   <b:if cond='data:showFreqNumbers'>
   <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
   </b:if>
   </span>
   </b:loop>
   </b:if>
   <b:include name='quickedit'/>
   </div>

   </div> </b:includable>
   </b:widget>
   
   
8. Jangan lupa Simpan Template.

Beda template mempunyai karakter yang berbeda, mungkin di blog sobat kode yang ada adalah

<div class='widget-content'>

Tidak sama dengan blog saya

<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'> 

Yang penting letakkan  tersebut dan sisipkan sesuai tempatnya,,,lalu jika anda ingin menambah link atau java sripe yang nanti hasilnya bisa di gulir atau fungsi srollnya aktif langsung aja perhatikan kode di bawah angkah ini
<div style="height: 200px; overflow: auto; width: 100%;">
<ul>



<script type="text/javascript">
removeRelatedDuplicates();
printRelatedLabels();
</script>
</ul>
</div>

Kode yang berwarna merah yang harus sobat tambahkan di antara kode java sript atau html sobat ,,,Giimana mudahkan :)