Danie Sharra's Blog: Scrool

Scroll berfungsi untuk menyederhanakan tampilan sepaya 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. Disini saya akan menjabarkan 3 macam cara membuat scroll widget di blogspot.

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. Kalau tidak percaya silahkan anda coba sendiri dengan menggunakan notepad. Berikut cara membuat scroll widget yang saya maksudkan.

Cara Pertama
1. Buka Pengaturan blogspot anda, Design, Page Element. Silahkan anda tambahkan widget baru dengan klik add a 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>

3. Letakkan kode anda diantara kode div diatas,

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

3. Usahakan yang berwarna merah harus sama dengan nama widget yang hendak anda jadikan scroll

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

Semoga Bermanfaat :)

      1.Klik Design/Layout/Tata Letak
      2.Page Element
    3.Add a Gadget HTML/Javascript

Copas kode di bawah ini dan simpan di dalam kotak gadget (konten),penempatan widgetnya silahkan sesuaikan dengan keinginan sahabat yang penting tata letaknya kelihatan cantik dan rapih.

<div style="overflow:auto;width:250px;height:300px;border:1px solid #eee;padding:8px;margin:10px 0 0"> <script style="text/javascript" src="http://files.bloggerplugins.org/widgetcomments.js"></script><script style="text/javascript">var a_rc=10;var m_rc=true;var n_rc=true;var o_rc=58;</script><script src="http:/daneyyy.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"></script> <div style="font-size:9px; padding:8px 0px 0px 0px"></div></div>

Url daneyyy silahkan ganti dengan alamat Url blog sahabat,lebar dan tinggi widgetnya silahkan boz atur sendiri dengan merubah tulisan yang berwarna biru, kemudian atur banyaknya recent comment yang masuk dengan merubah tulisan berwarna hijau dan 58 adalah jumlah karakter kata yang akan ditampilkan.

Kalau sudah tinggal Save Template.
baca juga : Cara Membuat Show-Hide Komentar/Expand-Collapse Comment, Membuat Komentar Terbaru dengan Gamba,