Cara Merubah Tampilan Scrollbar Pada Blog

TutorLoad30 - Kembali lagi dengan postingan baru. Kali ini saya mau berbagi tutorial mengenai Cara Merubah Tampilan Scrollbar Pada Blog. Pada dasarnya scroolbar tampilan default memiliki tampilan yang biasa-biasa saja. Mengganti scrollbar tentu akan mempercantik tampilan blog anda dengan kode CSS tambahan, cara ini tidak akan berpengaruh terhadap optimasi SEO jadi tidak perlu khawatir.

Bisa anda liat sendiri di blog saya juga sudah saya aplikasikan cara ini untuk merubah tampilan scroolbar web saya sehingga terlihat lebih pas berpadu dengan template blog.

Scrollbar

Langsung saja ikuti langkah-langkah dibawah ini.

1. Login pada Blogger
2. Silahkan menuju ke Template - Edit HTML
3. Cari kode ]]></b:skin> , kemudian letakkan kode di bawah ini tepat di atasnya.

/* Scrollbar */
     ::-webkit-scrollbar {height:10px;width: 10px;background: #EBEBEB;}
     ::-webkit-scrollbar-thumb {background-color: #DE1616;}

• Bagian berwarna merah adalah untuk warna background nya.
• Bagian berwarna coklat adalah bagian untuk warna scrollbar nya

Silahkan anda berkreasi dengan mengganti warna sesuka anda, untuk mengetahui kode warna silahkan lihat Disini. Anda juga bisa merubah ukurannya ingin tebal atau tipis dengan merubah pada bagian "height" dan "width".

Perlu anda ketahui sebelumnya bahwa penggunaan CSS scrollbar ini pada beberapa browser seperti mozilla tidak bisa berfungsi dikarenakan tidak memiliki basis WebKit. Untuk melihat hasil silahkan anda menggunakan browser seperti Google Chrome, Opera.

Sekian tutorial untuk Cara Merubah Tampilan Scrollbar Pada Blog. Apabila anda mengalami masalah atau kesulitan silahkan tuangkan pada kolom komentar yang sudah di sediakan di bawah, saya akan coba membantu. Semoga bermanfaat ~

Tweet