Memberi Scroll pada Label di Blog

Published by Kurnia Septa Selasa, 20 Desember 2011

Berawal dari pertanyaan dari seorang teman di twitter, Bagaimana cara memberi scroll pada lebel? Akhirnya saya cari-cari dan menemukan cara itu. Label itu memang penting, usahakan setiap tulisan diberi label yang sesuai, fungsinya adalah untuk mempermudahkan penelusuran berdasarkan label dan mengetahui tulisan (postingan) yang terkait berdasarkan kesamaan label.

Memang sangat tidak enak dipandang dan bikin susah jika ada banyak label. Apalagi jika jika dibuat tampilannya mendatar, satu-satu dari atas. Sidebar jadi terlihat memanjang ke bawah. Tidak seimbang dengan post area. Oleh sebab itu untuk mengakalinya bisa memberi scoll pada label. Sehingga fungsi scroll akan membuat lebih rapi.

Cara Memberi Scroll pada Label di Blog
1. Login ke Blogger.
2. Di halaman Dasbor, kita pilih Rancangan.
3. Kemudian pilih Edit HTML
4. Beri tanda centang pada Expand Template Widget
5. Cari kode 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:300px;'>
<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>

6. Kode yang berwarna merah adalah kode yang harus kita sisipkan, dan 300 adalah tingginya.
7. Simpan Template jika sudah selesai.

Jika di template kamu tidak menemukan kode  
<div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
berarti cari kode <div class='widget-content'>
dan sisipkan kode yang berwarna merah setelah itu.