Bagi blogger pemula seperti AB ini, ingin rasanya memasang banyak widget yang AB Suka. Tapi kadang-kadang banyaknya widget bisa memakan tempat pada blog sehingga tidak rapi. Oleh karena itu AB memberanikan diri memberikan tips bagaimana Cara Membuat Scroll Pada Blog untuk Widget tertentu biar rapi.
Widget Script:
Yang harus anda lakukan
1. Anda harus buka blog anda dengan account anda sendiri
2. Masuklah pada Rancangan template.
3. Pilih Add Widget -->> pilih HTML/JavaScript.
4. Copy lah script ini
<div style="overflow:auto; padding:3px; margin:0px 0px 0px 0px; width:150px; height:180px; background-color: rgb(255, 255, 255); border:1px solid #ddd;">
</div>
5. Lalu tekan Simpan/Save. -->>> Lalu simpan template anda.
6. Lihat hasilnya
Catatan:
- Untuk yang berwarna merah sesuaikan ukuran yang anda suka
- Untuk Yang berwarna
biru copy kode script widget yang anda ingin pasang
Widget Dari Google :
Yang harus anda lakukan
1. Anda harus buka blog anda dengan account anda sendiri
2. Masuklah pada Template >> Edit HTML. Jangan lupa centang Expand Widget
3. Carilah kode script yang ingin anda buat scroll. (agar mudah gunakan Ctrl+F3)
4. Tambahkan kode style='overflow:auto; height:95px' pada contoh kode bloglis saya di bawah ini :
<div class='column2'><b:section class='addwidget' id='col2' preferred='yes' style='float:left;'><b:widget id='BlogList1' locked='false' title='Link Blog Teman' type='BlogList'><b:includable id='main'> <!-- only display title if it's non-empty --> <b:if cond='data:title != ""'> <h2 class='title'><data:title/></h2> </b:if>
<div class='widget-content'> <div class='blog-list-container' expr:id='data:widget.instanceId + "_container"'> <ul expr:id='data:widget.instanceId + "_blogs"'> <b:loop values='data:items' var='item'> <li expr:style='data:item.displayStyle'> <div class='blog-icon'> <b:if cond='data:showIcon == "true"'> <input expr:value='data:item.blogIconUrl' type='hidden'/> </b:if> </div>
5. Dan akan menjadi :
<div class='column2'>
<b:section class='addwidget' id='col2' preferred='yes' style='float:left;'>
<b:widget id='BlogList1' locked='false' title='Link Blog Teman' type='BlogList'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content' style='overflow:auto; height:95px'>
<div class='blog-list-container' expr:id='data:widget.instanceId + "_container"'>
<ul expr:id='data:widget.instanceId + "_blogs"'>
<b:loop values='data:items' var='item'>
<li expr:style='data:item.displayStyle'>
<div class='blog-icon'>
<b:if cond='data:showIcon == "true"'>
<input expr:value='data:item.blogIconUrl' type='hidden'/>
</b:if>
</div>
6. Simpan, dan lihat hasilnya.
Judul : Cara Menambah Scroll Pada Widget Blog | Tips Blogger
Deskripsi : Cara Menambah Scroll Pada Widget Blog | Tips Blogger - K ali ini saya akan memaparkan bagaimana Cara Membuat Scroll Pada Blog. Walau sebe...
