Cara Membuat Scroll Box Pada Widget Sidebar

Seringkali saat aku mengunjungi suatu blog, blog tersebut menampilkan beberapa widget yang panjang kebawah. Sampai-sampai nye-croll nya cape sendiri dech. Padahal pasti sang pemilik blog menampilkan widget tersebut agar dilihat pengunjung yang datang ke blog nya dong. Nah sebagai newbi seperti aku ini, tentu aku ga mau juga dong buat blog ku seperti itu yang menurut pendapat pribadiku kurang efektif (ini pendapatku loch…..). Akhirnya kucari bagaimana agar suatu blog efektif dan tampilan widgetnya tidak terlalu panjang, dan jawabannya kudapat dengan memasang fungsi scroll pada widget yang tampilannya terlalu panjang.

Oh yah hampir lupa nich, adapun contoh beberapa widget yang cenderung berjejer ke bawah/memanjang misalnya adalah: arsip blog, label, feedjit, shout box dan lain-lain. Di bawah ini adalah salah satu contoh tampilan widget feedjit:

Okay sekarang sudah tahu kan maksud tulisan ku yang diatas, sekarang kita langsung aja gimana cara buat scroll box yang kumaksud.

1. Masuk ke blog sobat, dari halaman dasbor pilih Rancangan.

2. Kemudian klik Edit pada widget yang akan sobat beri scroll box.

3. Kemudian sisipkanlah kode dibawah ini kedalam widget tersebut, yang berwarna biru diawal dan warna merah diakhir.

<div style="overflow:auto; width:100%px; height:400px; padding:0px; border:1px solid #999999;">

</div>

4. Contoh detilnya seperti di bawah ini:

<div style="overflow:auto; width:100%px; height:400px; padding:0px; border:1px solid #999999;">
<center><script type="text/javascript" src="http://feedjit.com/serve/?vv=531&amp;tft=3&amp;dd=0&amp;wid=08439e9cd9b93dce&amp;pid=0&amp;proid=0&amp;bc=FFFFFF&amp;tc=000000&amp;brd1=012B6B&amp;lnk=135D9E&amp;hc=FFFFFF&amp;hfc=2853A8&amp;btn=D8E6DA&amp;ww=200"></script><noscript><a href="http://feedjit.com/">Feedjit Live Blog Stats</a></noscript></center>
</div>

Catatan:

* height:400px = tinggi kotak scroll

* padding:0px = jarak isi widget dari kiri dan atas

* border:1px = ukuran garis pinggir kotak

* #999999 = kode warna

5. Jika sudah, klik simpan

6. Hasilnya akan seperti dibawah ini:

Berhasil kan sobat? Semoga bermanfaat.
Catatan:
Untuk membuat feedjit/live traffic feed seperti contoh gambar diatas dapat sobat klik disini.


Sumber: http://www.blogernas.co.cc