Cara Mengganti Tampilan Scroll Bar jadi Keren di Blog

Cara Mengganti Tampilan Scroll Bar jadi Keren di Blog – Sobat blogger tentu tahu apa itu scroll bar bukan? Yup, scroll bar arau bar penggulung adalah suatu baris yang berisikan kotak, yang digunakan untuk menggulung layar, baik ke kiri kanan ataupun ke bawah atas. Oh iya. Ngomong – ngomong soal scrollbar, tentu Anda sudah membaca postingan terdahulu saya bukan, yang membahas cara memasang scroll bar pada kotak komentar? Jika belum, monggo boleh dibaca nanti.  Secara default, scroll bar akan memiliki warna yang berbeda, tergantung sistem operasi dan browser user yang mengakses blog. Contohnya, lihat tampilan blog Tips SEO + Blog – PC 123 yang diakses dengan browser QtWeb berikut ini :

Nah, dengan sedikit kreatifitas dan kustomisasi CSS blog, kita dapat menganti warna dan tampilan scroll bar dalam blog menjadi lebih menarik dan unik. Contohnya seperti gambar dibawah ini.

Tertarik mengganti scroll bar blog Anda menjadi lebih menarik? Silahkan ikuti langkah – langkah dibawah ini :

1.     Buka akun Blogger Anda, lalu masuk ke Template.

2.     Buat sebuah backup dari template blog Anda, lalu klik Edit HTML.

3.     Tekan CTRL+F, lalu cari kode ]]></b:skin>

4.     Pastekan kode berikut diatas kode ]]></b:skin>

::-webkit-scrollbar {height:12px;width: 12px;background: #00CC00;} ::-webkit-scrollbar-thumb {background-color: #FF9900;-moz-border-radius: 10px;border-radius: 10px;}

Catatan : Kode yang berwarna hijau menentukan warna latar (rel) scrollbar, sedangkan kode yang berwarna oranye menentukan warna bar pada scrollbar. Gantilah sesuai dengan keinginan. Jika Anda tak hapal dengan kode HTML warna, klik disini.

5.     Terakhir, klik Simpan.

Bagaimana? Jika efek tidak terlihat, coba ganti browser yang Anda gunakan. Efek ini hanya berfungsi pada browser dengan basis WebKit, seperti pada browser QtWeb ataupun Google Chrome. Selamat mencoba! Jika Anda merasa artikel ini bermanfaat, tolong share, berikan Google + dan like Fanpage blog ini. Terima kasih, dan salam blogger!