Cara Merubah Tampilan Scrollbar di Blogger

Pada kesempatan kali ini, Mas Adhie akan berbagi tutorial bagaimana cara merubah tampilan scrollbar pada blog. Seperti kita tahu, scrollbar adalah alat yang digunakan untuk menggeser untuk melihat bagian atas, tengah ataupun bawah suatu website. Scrollbar ini akan muncul bila website/blog Anda melebihi kapasitas layar monitor sobat.

Secara standard tampilan scrollbar seperti gambar diatas, namun dengan menambahkan CSS pada template, kita bisa mendapatkan tampilan yang berbeda, namun CSS ini setahu saya hanya bekerja pada browser Google Chrome. Apabila sobat semua menggunakan browser Mozilla Firefox, maka tidak bisa melihat perubahan ketika sobat menambah CSS scrollbar pada template sobat.

Nah, berikut ini adalah panduan singkat bagaimana cara merubah tampilan scrollbar untuk blog sobat semua.

1. Langkah pertama, login ke akun Blogger sobat

2. Kemudian masuk di menu Template > Edit HTML

3. Kemudian copy kode CSS dibawah ini kedalam template dan letakkan diatas kode  ]]></b:skin>

/*CSS ScrollBar Google Chrome */
::-webkit-scrollbar {height:12px;width: 12px;}
::-webkit-scrollbar-track {background:#474747;}
::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb:window-inactive { background: #222222; }

Jika anda ingin merubah warna ganti saja kode warna #474747 & #222222 sesuai keinginan, dan jika ingin merubah lebar scroll bar anda ganti Width yang semula 12px menjadi ukuran lebih kecil atau lebih besar, misalnya 6px.

4. Klik pratinjau terlebih dahulu, apabila tidak ada masalah yang muncul, klik simpan dan lihat perubahan pada blog sobat (menggunakan browser Google Chrome)

Apabila tutorial ini masih belum jelas, silahkan tinggalkan komentar pada form dibawah ini. Selamat mencoba dan semoga berhasil.