Wednesday, May 25, 2011

Menambahkan Scroll di Blogroll

Cara menambahkan scroll di blogroll yang dibahas disini bertujuan agar blogroll yang terpasang diblog Anda tidak memakan banyak tempat dan tetap rapi walaupun link yang terpasang diblog anda banyak, seperti yang terlihat di footer blog ini.
 
Sebelum Anda menambahkan scroll, terlebih dahulu pasang Widget Blogroll dengan cara :
  1. Login ke draft.blogger.com
  2. Klik Design
  3. Add a Gadget
  4. Pilih Link List
Sedangkan cara menambahkan scroll di blogroll :
  1. Login ke draft.blogger.com
  2. Klik Design
  3. Klik Edit HTML
  4. Centang Expand Widget Templates
  5. Cari kode yang mirip dengan kode berikut :
    <b:widget id='LinkList1' locked='false' title='Blogroll' type='LinkList'>  
<b:widget id='LinkList2' locked='false' title='Blogroll' 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>
</div>
</b:includable>
</b:widget>

Tambahkan kode <div style='width:100%; height:100px; overflow: auto;'> diatas kode <ul> dan kode </div> dibawah kode </ul>, sehingga menjadi seperti dibawah ini

<b:widget id='LinkList2' locked='false' title='Blogroll' type='LinkList'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content'>
<div style='width:100%; height:100px; overflow: auto;'>
<ul>
<b:loop values='data:links' var='link'>
<li><a expr:href='data:link.target'><data:link.name/></a></li>
</b:loop>
</ul>
</div>
</div>
</b:includable>
</b:widget> 
width:100% dan height:100px dapat dirubah sesuai kebutuhan agar sesuai dengan template blog Anda


Share on :