Headlines News :
Home » » Cara Mudah Membuat Scroll Bar Kategori Blogspot

Cara Mudah Membuat Scroll Bar Kategori Blogspot

Written By Anonymous on Thursday, September 20, 2012 | 2:21 AM


Islamic Defenders - 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:
  1. Silahkan Login ke account blogger anda.
  2. Pada halaman dashboard pilih Design -> Edit HTML
  3. Backup dulu template Anda dengan pilih Download Full Template, kalau sudah selesai backup template Anda, teruskan langkah dibawah.
  4. Jangan lupa centang Expand Widget Templates.
  5. Cari kode seperti dibawah ini , Anda bisa gunakan Ctrl+ F, atau tekan F3
<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;'>
<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>

Perhatikan kode <ul> yang saya warna merah.
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.

Coba lihat lihat blog Anda, scroll barnya sekarang sudah jadi. Begitulah Cara Mudah Membuat Scroll Bar di Sidebar Blogspot.
Raih Amal shalih sebarkan ini :

Silahkan berkomentar

Gunakan sopan santun sebagai tanda orang yang berakhlaq baik

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Islamic Defenders Community - All Rights Reserved
Islamic Defenders Community | Komunitas Pembela Islam