ADS HERE

Thursday, December 18, 2008

Widget scroll bar ini sangat membantu sekali menurut ku, bisa dilihat sendiri sidebar blog ini bisa lebih diminimalkan dari sebelumnya. Dari yang sebelumnya sidebar blog ini memanjang kebawah, dengan adanya widget scroll bar ini, maka sidebar blog ini gak memanjang kebawah lagi. Perhatikan elemen label/kategori dan elemen link blogroll yang menggunakan scroll pada sidebar kiri blog ini, itu salah satu contoh penggunaannya. Buat kamu yang mau silahkan copy kodenya dibawah ini:

Tambahkan kode dibawah ini pada elemen halaman blog kamu dan lihat hasilnya. Ganti kode warna merah dan biru sesuai kebutuhan kamu, jangan lupa mengubah height(tinggi) dan widht (lebar) sesuai kebutuhan sidebar blog kamu pada kode yang berwarna hijau.
<div class="widget-content">
<ul style="height:150px;width:150px; overflow:auto; ">
<li><a href="http://www.blogmu.blogspot.com">Your Text1</a></li>
<li><a href="http://www.blogmu.blogspot.com">Your Text2</a></li>
<li><a href="http://www.blogmu.blogspot.com">Your Text3</a></li>
<li><a href="http://www.blogmu.blogspot.com">Your Text4</a></li>
<li><a href="http://www.blogmu.blogspot.com">Your Text5</a></li>
<span style="font-weight:bold;"></span>
</ul></div>
Nah... kalo kamu mau link blogroll atau label disidebar blog kamu menggunakan scroll, ikuti langkahnya dibawah ini. Tinggal sedikit di otak-atik dengan menggunakan kode diatas.

Ku ambil contoh, untuk membuat link blogroll kedalam scroll bar. Karena biasanya link blogroll paling panjang kebawah, apalagi kalo blognya rajin link exchange dengan blog2 lain atau hobi ngoleksi link, kan gak lucu kalo satu sidebar hanya dihabiskan untuk link blogroll karena terlalu memanjang kebawah. Untuk membuatnya lebih pendek, salah satu solusinya adalah dengan cara ini :)

Cari kode berikut:
<b:widget id='LinkList1' locked='false' title='Links' type='LinkList'>
<b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Ganti dengan kode dibawah ini:
<b:widget id='LinkList1' locked='false' title='Links' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<ul style='height:270px;width:220px; overflow:auto; '>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
<span style='font-weight:bold;'/>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>
Kode warna merah adalah kode tambahan yang diambil dari kode widget scroll bar diatas, agar link blogrollnya bisa masuk kedalam scroll bar. Untuk elemen lainnya otak-atik sendiri ya hehehe.

Ok dech... silahkan dicoba dulu sebelum protes :)



Related Post



About Anaknias Blog :www.anak-nias.blogspot.com is a blog tutorials, tips and tricks, as well as the latest news about blogging, gadgets, health and other tips. Welcome, please leave a comment. No spam, no junk. If you have suggestions or criticisms, please contact us via email edo.bago[at]gmail.com.

12 komentar:

oPa said...

nanti ada scroll nya yah mas,.
mantep dah..nanti opa pasnag kl link teman-teman opa da banyak...

thefachia said...

wah jadi mantep nih widgetnya..

sip banget dah..

:D

AiWY said...

sudah ku praktekin mas. sep keren tips nya. thanks ya.

kapanpun said...

dengan scroll bar blog ini tampil manis

junjungpurba said...

bisa lihat contoh hasilnya?

Paman Gober said...

saya bookmark dulu ah... keren neh keknya... :)

welly said...

aku save dl deh halaman blog ini. kayaknya menarik yah tapi blm ada waktu buat mencobanya.. salam kenal !

the fachia said...

komentar dulu sebelum mencoba.. :D

bocahiseng said...

wahh boleh di coba dihh

www.aan.mania@gmail.com said...

haaaa!!!!! yang mau jd hecker silahkan kunjungi

http://mania-comunty.blogspot.com/

banyak tirk m tipsx

mau liatja sendiri

hhh3333

wahyupurbosejati said...

bos .... aku sudah coba, tapi napa gak muncul ya scroll barnya, yang muncul cuman panjangnya doang. tolong kasih saran dech. thx berat sekali.

kuryt said...

thanks untuk infonya dari kur fromMyokezone,blog stuf and fun information

Post a Comment