Membuat Scrollbar di Blog

Ada yang tau,apa itu scrollbar? coba lihat kode HTML dibagian widget Archive blog ini, pasti kawan melihat ada yang unik dari kode tersebut, yaitu kode tersebut berada didalam sebuah kotak yang bisa digerakkan keatas dan kebawah. Kotak itulah yang dimaksud scrollbar. Biasanya kode ini dipasang untuk widget tertentu semisal Archive, Category, ataupun kode HTML untuk bertukar link blog, tapi ada juga yang digunakan dalam postingan untuk mempersingkat tampilan berupa tulisan panjang. Sobat tertarik ? Berikut tipsnya :

Kalau kawan ingin membuat scrollbar didalam postingan, cukup ubah lembar kerja blog kawan ke mode HTML

Setelah itu, cukup kawan copas kode ini :

<div style='padding: 5px; overflow: auto; width: auto; height:200px;border:1px solid #000000'>

Tulis apapun tulisan kawan

</div>

Ganti kode Width: auto; , Height:200px , border:1px solid dan #000000 sesuai kebutuhan kawan.


Tetapi kalau kawan ingin membuat scrollbar pada widget, caranya ialah

Masuk ke Template,,->Edit HTML,,-> tandai pada "Expand Template Widgets"
Sebelumnya kawan harus tau dulu kode dari widget kawan, contoh :

Untuk Profile :
<b:widget id='Profile1' locked='false' title='About Me' type='Profile'>
Untuk Archive :
<b:widget id='BlogArchive1' locked='false' title='Archives' type='BlogArchive'>
Untuk  Kategori :
<b:widget id='Label1' locked='false' title='Archives' type='BlogArchive'>
Untuk Follower :
<b:widget id='Followers1' locked='false' title='Archives' type='BlogArchive'>

(Semua widget memiliki kode yang sama yaitu seperti diatas. Untuk yang ini, saya anggap kawan sudah mengerti)
Ambil kata yang diberi garis bawah, tergantung widget mana yang ingin diberi scrollbar.

Kemudian cari kode ]]></b:skin> lalu paste kode ini diatasnya:

#Kata yang diberi garis bawah .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}


Ganti Kata yang diberi garis bawah dengan kata bergaris bawah yang tadi dijelaskan diatas lalu ganti 200px sesuai kebutuhan.

ini sebagai contoh, yaitu kalau ingin memberi scrollbar pada archive:

 #BlogArchive1 .widget-content{
height:200px; /* Tinggi yang diinginkan */
width:auto;
overflow:auto;
}

Selebihnya terserah selera kawan.Oke selamat mencoba .