Tutorial Buat Scroll Pada Bloglist

Semua murid bangun!!! huhuhu... ok apabila krole dah mula berkata macam tu maksudnya krole nak buat tutorial pada hari ini ahaks~ hari ini krole nak buat tutorial bagaimana caranya untuk membuat scrolling bloglist seperti yang ada kat blog krole ni, mesti korang nak tahu kan??? mengapa krole tiba-tiba jak nak buat tutorial ni kan??? (huhuhu adakah???) cuba korang tengok gambar kat atas tu!!! diatas permintaan daripada blogger ayu krole terpanggil untuk membuat tutorial ni, kerana bak kata pepatah otai-otai blogger... "sharing is caring" pergh!!! lama tak sebut ayat ni ahaks~ ok, kepada blogger ayu dan member-member semua sebenarnya nak buat scroll dalam bloglist ni senang jak ahaks~ so kalau korang semua ikut step-step yang krole sediakan dalam tutorial ni komfirm berjaya!!! yeah!!! kerana seperti biasa didalam blog ni krole buatkan tutorial ini sesimple yang boleh agar mudah difahami, kita mulakan~

Step 1 :
-login masuk kedalam akaun blogger anda dan klik Design>>>Edit HTML>>>cari code seperti dibawah.

<b:widget id='BlogList1' locked='false' title='Blog List' type='BlogList'>

<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>

*yang krole warnakan kuning tu berbeza mengikut tajuk yang diberikan kepada widget ye~

Step 2 :
-kemudian tambahkan code yang berwarna merah seperti dibawah

<b:widget id='LinkList1' locked='false' title='Blog Roll' type='LinkList'>

<b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>

<div class='widget-content'>

<div class='blog-list-container' expr:id='data:widget.instanceId + "_container"' style='overflow: auto; display: block; overflow-x: no; overflow-y: scroll; height: 300px; width: 160px;'>

<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> </div>

</b:includable>

</b:widget>


*lebar dan tinggi boleh diubah pada heigh dan width mengikut kehendak anda~

kemudian save dan siap!!! anda dah berjaya!!!




p/s : senang kan???