Cara Membuat Kotak Label Dengan Scroll

Setiap blogspot pasti memiliki "Labels / Kategori" postingan yang sangat banyak, sehingga akan memakan sidebar yang cukup banyak jika kita tampilkan pada sidebar website atau blog kita, namun hal tersebut bisa diatasi dengan memberikan fungsi scroll box pada widget label tersebut. untuk membuatnya cukup mudah, sobat ikuti saja langkah-langkah dibawah ini

- Seperti biasa sobat Log in ke 'blogger'

- Masuk ke rancangan - Edit HTML [jangan lupa centang kotak expand template widget]
- Cari kode dibawah ini :

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

- Setelah ketemu kode tersebut, sekarang sobat copy dan paste kode dibawah ini tepat dibawah kode yang telah dicari tadi

<div style='overflow:auto; width:ancho; height:250px;'>

- Selanjutnya Scroll kebagian bawah sedikit dan temukan kode </b:includable>

- Setelah itu sobat copy dan paste kode dibawah ini tepat diatas kode tersebut

</div>

Terakhir simpan template dan silahkan lihat hasilnya.

Untuk lebih jelasnya penempatannya sebagai berikut :

<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>

Setiap template mempunyai karakter yang berbeda, patokannya adalah script

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

yang penting letak kode tambahan yang disisipkan harus benar meletakkannya.

Untuk kode height:250px adalah tinggi label scroll, silahkan sobat ganti dengan angka yang lebih tinggi jika ingin tampilan menu label yang lebih tinggi.

Saya kira itu cukup sekian pelajaran blog kali ini, terima kasih.