Pada kesempatan yang lalu saya sudah membahas tentang Cara Membuat Scroll pada Popular Post, nah pada kesempatan ini saya akan bahas tentang Cara Mudah Membuat Scroll Bar Kategori Blogspot.
Biasanya sebuah blog yang masih baru hanya mempunyai beberapa kategori, tapi lama kelamaan jumlah kategori akan bertambah. Hal ini akan membuah listing kategori memanjang kebawah dan tentu saja akan sangat menyita bidang sidebar blog Anda. Apalagi jika Anda ingin memonitize blog Anda dengan berbagai iklan, sudah pasti Anda akan kehabisan tempat di sidebar blog Anda. Untuk mengatasi hal tersebut diatas Anda bisa menggunakan teknik scroll bar dimana listing kategori blog Anda diletakkan di dalam scroll bar.
Berikut saya berikan Cara Mudah Membuat Scroll Bar di Sidebar Blogspot sbb:
Silahkan Login ke account blogger anda.
Pada halaman dashboard pilih Design -> Edit HTML
Backup dulu template Anda dengan pilih Download Full Template, kalau sudah selesai backup template Anda, teruskan langkah dibawah.
Jangan lupa centang Expand Widget Templates atau langsung saja Cari kode seperti dibawah ini dengan mengggunakan Ctrl+ F, atau tekan F3 jika tampilan blogger anda sudah menggunakan tampilan terbaru.
Biasanya sebuah blog yang masih baru hanya mempunyai beberapa kategori, tapi lama kelamaan jumlah kategori akan bertambah. Hal ini akan membuah listing kategori memanjang kebawah dan tentu saja akan sangat menyita bidang sidebar blog Anda. Apalagi jika Anda ingin memonitize blog Anda dengan berbagai iklan, sudah pasti Anda akan kehabisan tempat di sidebar blog Anda. Untuk mengatasi hal tersebut diatas Anda bisa menggunakan teknik scroll bar dimana listing kategori blog Anda diletakkan di dalam scroll bar.
Berikut saya berikan Cara Mudah Membuat Scroll Bar di Sidebar Blogspot sbb:
Silahkan Login ke account blogger anda.
Pada halaman dashboard pilih Design -> Edit HTML
Backup dulu template Anda dengan pilih Download Full Template, kalau sudah selesai backup template Anda, teruskan langkah dibawah.
Jangan lupa centang Expand Widget Templates atau langsung saja Cari kode seperti dibawah ini dengan mengggunakan Ctrl+ F, atau tekan F3 jika tampilan blogger anda sudah menggunakan tampilan terbaru.
<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='"widget-content " + data:display + "-label-widget-content"'>
<b:if cond='data:display == "list"'>
<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>
Perhatikan kode <ul> yang saya warna Biru langit.
Gantilah kode <ul> menjadi <ul style= 'height:200px;width:210px; overflow:auto;'>
Keterangan:
Kode title=’Categories’ bisa berbeda untuk setiap blog. Bisa ditemukan dengan title=’Label’ atau title=’Kategori’, tergantung masing2 blogger dalam menamainya gadgetnya.
height:200px adalah untuk tentukan tinggi widget.
width:210px adalah untuk tentukan lebar widget.
Silahkan Anda sesuaikan dengan tinggi dan lebar scroll barnya dengan merubah angka diatas.
5. Klik Save untuk simpan template blog Anda.
Demikianlah Cara Mudah Membuat Scroll Bar Kategori Blogspot ini semoga dapat dimengerti dan bermanfaat....
0 komentar:
Post a Comment