Cara Membuat Scroll Pada Blog

Ada berbagai cara untuk membuat blog anda menjadi kelihatan rapih. Salah satunya yaitu dengan menerapkan scroll pada element tertentu di blog. Scroll berfungsi untuk menyederhanakan tampilan supaya lebih terlihat rapi dan menjadi tidak terlalu luas. Untuk membuat scroll widget blogspot ada beberapa cara, tergantung bagi anda ingin menggunakan cara mana yang paling simpel dan sederhana bagi anda.
Yang menjadi code utama untuk membuat scroll ini adalah adanya code overflow. Jadi jika anda menemukan kode seperti ini, maka ini akan membentuk sebuah scroll. Berikut cara membuat scroll widget.




Cara Pertama
1. Buka Pengaturan blogspot anda, Tambahkan elemen baru pada salah satu elemen halaman anda. Pilih gadget HTML/Javascript.
Salin kode berikut ke elemen halaman yang baru ditambahkan

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

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

3. Letakkan kode anda diantara kode div diatas,
Untuk ukurannya sesuaikan dengan blog anda atau keinginan masing-masing.
Untuk yg warna biru,.lebar scroll, warna merah ketinggian, warna kuning jarak antara border/garis pinggir dengan text. Warna hijau untuk ketebalan garis kotak scroll.


Cara Kedua
1. Buka Pengaturan, Design, Edit Html. Lalu cari nama widget yang hendak anda jadikan scroll. Misalkan saja disini Archive blog, maka saya akan cari tulisan BlogArchive

2. Tambakahan kode CSS berikut ini diatas ]]></b:skin>

#BlogArchive .widget-content{
height:200px;
width:auto;
overflow:auto;
}

Yang perlu di perhatikan :
• BlogArchive1 adalah ID dari widget BlogArchive1.
• height:200px; adalah tinggi dari widget scroll. Ganti dengan tinggi widget scroll yang anda inginkan



Cara Ketiga
1. Pada Edit html template blogspot, silahkan anda cari widget yang hendak anda berikan scroll. Lalu pada bagian bawah dari kode widget tersebut cari kode

 div class='widget-content'

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

Ubah ketinggiannya pada height sesuai keinginan anda.


Silahkan anda pilih menurut anda cara yang paling mudah dan biasa anda lakukan. Selamat mencoba...keep blogging.
Semoga bermanfaat…