Mengatur Tampilan Label Dengan Scroll Bar

---

Setelah gadget Label ditambahkan, kita akan mengatur tampilannya agar tidak tampak berderet panjang ke bawah.  Hal ini sedikit rumit karena memerlukan pengeditan template dalam mode HTML.

Berikut langkah-langkahnya:

1. Setelah login dan masuk akun blogger, edit template blog anda dalam mode HTML 
   
2. Kemudian cari "Label" atau Categories (jika anda menggantinya dengan Categories) dengan Ctrl + F lalu ketik  Label/Categories + enter.
   
3. Anda akan menemukan gadget/widget Categories tersebut.  Tetapi ada script yang tersembunyi.  Untuk itu klik pada titik-titik tersebut agar script lengkapnya muncul.
   
   
   
   
   
   
   
4. Setelah script lengkapnya muncul kita akan menambahkan kode berikut: <div style='overflow:auto; width:ancho; height:180px;'> tepat diatas kode: <b:if cond='data:display == &quot;list&quot;'> dan ditutup dengan kode </div> tepat sebelum kode : </b:includable>  Angka 180px dapat anda ganti sesuai kebutuhan dan sidebar anda.

Lebih jelasnya sebagai berikut:

<b:widget id='Label1' locked='false' title='Categories:' 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:180px;'>     <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>

Sebelum disimpan lihat dahulu dengan klik pada Pratinjau Template (Preview) jika sudah cocok jangan lupa Simpan Template, lalu klik Kembali.  Sampai disini kita telah berhasil mengatur tampilan label dengan scroll agar tidak panjang ke bawah.

Hal yang hampir serupa dapat kita terapkan untuk mengatur tampilan widget/gadget yang lain.  Berikutnya kita akan membahas Mengatur Tampilan Entri Populer Dengan Scroll Bar, tapi sebelumnya anda tambahkan dahulu gadget Entri Populair/ Populair Pos dalam template anda.

Sebelumnya kita telah membahas cara Menambahkan Gadget Label.  Untuk menambahkan gadget-gadget yang lain caranya hampir sama, jadi tidak perlu dibahas semuanya.

---