Berbagai Cara Memasang Scroll Pada Widget

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Posting kali ini saya akan berbagi mengenahi cara membuat fungsi scroll pada widget entri populer/ populer posts. Namun cara ini juga bisa di terapkan pada widget-widget yang lain sesuai kebutuhan para blogger.

Dari hasil penelusuran saya mencari cara membuat sroll ini ternyata ada beberapa cara yang bisa di terapkan. Sebab terkadang suatu cara yang diterpkan seorang blogger pada blognya belum tentu bisa di terapakan pada blog lain. Saya sendiri goblog soal apa penyebabnya. Hanya kemungkinan karena penerapan template yang berbeda menjadikan pengaturannya berbada pula.

Langsung saja cara yang Petama seperti berikut :

1. Login Blogger

2. Klik Rancangan

3. Klik Edit HTML ( Centang 'Expand Template Widget'}

4. Kemudian Cari Judul Widget yang ingin kita beri fungsi scroll. Kita bisa mencarinya dengan klik control+F kemudian masukkan kode <b:widget id=

Ini contoh dari judul widget yang akan kita temukan :

<b:widget id=' BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/>
<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'/>
<b:widget id='Followers1' locked='false' title='Followers' type='Followers'/>
<b:widget id='HTML5' locked='false' title='Subscribe Via Email' type='HTML'/>
<b:widget id='HTML1' locked='false' title='Your Ad Here' type='HTML'/>

yang berwarna merah adalah judul widget. Kalau kita ingin membuat fungsi scroll pada popular posts/entri populer maka langkahnya sebagai berikut :

Pada bagian edit html cari kode ini ]]></b:skin> .

Copy dan paste kode di bawah ini diatas kode ]]></b:skin>.

# PopularPosts1 .widget-content{
height:270px;
width:auto;
overflow:auto;
}

5.simpan template dan lihat hasilnya.

Untuk membuat fungsi scrollnya pada widget yang lain, hapus saja kode yang berwarna merah dan ganti dengan judul widget yang lainnya, seperti keterangan pada no.4.
Untuk mengatur tingginya,ganti angka 270 dengan yang kita inginkan.

Cara yang ke Dua :

Buka Pengaturan blogspot , Tata Letak dan pada kali ini kita membuat widget baru dengan klik tambah gadget, lalu pilih add html/javascript

2. Berikan judul dan pada pada bagian content letakkan kode seperti ini :

<div style="overflow:auto; width:100%px; height:200px; padding:10px; border:1px solid #999999;">
.......
</div>

Atau kode ini :

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

3. Letakkan kode anda diantara kode div diatas,

Cara Ke Tiga

1. Pada Edit html template blogspot, kita cari widget yang hendak kita berikan scroll. Lalu pada bagian bawah dari kode widget tersebut cari kode div class='widget-content'
Karena saya akan memasang scrollnya pada widget popular posts/entri populer maka yang saya temukan pada blog saya kodenya seperti ini :

div class='widget-content' polular posts

2. Tambahkan kode style='overflow:auto; height:230px'

disamping kode div class='widget-content' Sehingga menjadi

<div class='widget-content' style='overflow:auto; height:230px'>

Kalau saya cukup buang saja kode

div class='widget-content' polular posts

kemudian saya copy paste kode

<div class='widget-content' style='overflow:auto; height:230px'>

Lalu simpan template…

Demikian semoga bermanfaat…….

• 
• 
• 
• 
• 
• 
• 
•