Cara Membuat Scroll pada lebel/kategori

Bagi para sobat bloger yang yang memiliki jumlah postingan yang sudah banyak tentunya jumlah kategori pun semakin banyak, karena bayaknya tema pada artikel yang telah sobat tulis. Ini akan menjadi "masalah" karena penataan widget yang akan terlihat "berantakan" seperti blog ini. Namun bagi sobat yang tetap nyaman menggunakan kategori tanpa fungsi scroll saya kembalikan pada sobat sekalian karena hal ini berhubungan dengan selera masing-masing dalam pengelolaannya.
Berikut ini adalah gambar yang saya ambil saat post ini saya tulis:

Bagi sobat yang ingin membuat widgat kategori dengan fungsi scroll silahkan ikuti tips ngeblog berikut ini:

1. Login terlebih dahulu mengunakan akun bloger
2. Buatlah Label dengan menambah Gadget pada sidebar, beri nama dengan "Katagori" ( bisa dirubah sesuai keingian )
3. simpan/save. sampai disini anda telah membuat kategori ( tanpa fungsi scroll ).
4. Utuk menambahkan fungsi scroll Sekarang pilih Tata letak -- -->>Edit HTML.
5. Beri tanda centang pada Expand Template Widgets.
6. Cari label yang sudah di buat tadi, dengan CTRL+F dan ketikkan “Kategori”,  ( biasanya di pojok kanan bawah ). akan muncul kode hatml seperti di bawah ini:
   
   
   <b:widget id='Label1' locked='false' title='Kategori' type='Label'>
   <b:includable id='main'>
   <b:if cond='data:title'>
   <h2><data:title/></h2>
   <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
   <div style='overflow:auto; width:ancho; height:200px;'>
   <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>
   
   
7. Perhatikan tulisan yang berkedip dan berwarna merah di atas, kode itulah yang harus disisipkan kedalam lebel yang telah dibuat
8. Simpan template dan lihatlah hasilnya

Catatan:

• Angka 200 yang berwarna biru berkedip pada tulisan height:200px menunjukan ukuran tinggi lebel fungsi scroll, silahkan di rubah sesuai dengan keinginan.
• Setiap template mempunyai karakter yang berbeda, antara:
  <div class='widget-content'>
  dan
  <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'> 
  Tidak masalah dengan perbedaan kode yang penting letak kode tambahan yang disisipkan harus benar meletakkannya.
  

Semoga bermanfaat dan Selamat mencoba.......