Senin, 29 April 2013

Cara Mengubah Tampilan Scroll Blog

Mungkin semua sahabat bloger sudah tau apa yang dimaksud dengan Scroll Bar. Beberapa hari yang lalu saya mengunjungi Blog tetangga yang lumayan keren sih, waktu saya ingin membaca artikelnya sampai ke bawah, saya pun terkejut melihat bentuk dan warna scroll bar nya. Nah, maka dari itu saya ingin membuat postingan ini agar para Sahabat Bloger bisa mempercantik tampilan blog nya. Script ini tidak berpengaruh terhadap loading blog kita masing-masing. Dibawah ini adalah contoh dari scroll bar Blog Saya

Cara Mengganti Warna, Bentuk Scroll Bar Di Blog
Untuk cara menampilkan scrollbar yang berbeda, baik itu warna, ukuran dan bentuk, kalian cukup copy paste kode css scrollbar dibawah ini dan letakan diatas kode ]]></b:skin>, dalam beberapa template penempatan css scrollbar ini tidak berjalan dengan baik jika diletakan diatas kode ]]></b:skin> seperti pada template Delod Mangkalan untuk mengatasi hal itu kode css scrollbar bisa diletakan dibawah kode <b:skin><![CDATA[
Cara nya adalah :
1. Login Ke blog sobat masing-masing,Lalu pilih tab tempalte.2. Centang Expand Template Widget, Lalu Cari Kata ]]></b:skin> . Untuk mempermudah pencarian kata, sobat bisa menekan tombol CTRL+F di keyboard
3.  Copas kode dibawah ini tepat di atas kod  ]]></b:skin>



::-webkit-scrollbar {width: 13px;background: #000000;-webkit-border-radius:10px;border-radius: 10px;}::-webkit-scrollbar-thumb {background: #0000CD;-webkit-border-radius:10px;border-radius: 10px;}
4. Setelah semuanya siap. Lalu Klik Simpan Template
NB : - Ganti tulisan yang berwarna merah dengan ukuran scroll bar yang sobat ingin kan        - Ganti tulisan yang berwarna biru dengan warna template sobat, jika template sobat menggunakan warna putih, ganti dengan #FFFFFF . Dan jika template sobat menggunakan warna hitam seperti blog saya, ganti dengan #000000        - Ganti tulisan yang berwarna hijau dengan warna scroll yang sobat ingin kan. Saya menggunakan warna biru yang sesuai dengan blog saya.
Jika kesulitan untuk mencari kode warnanya, Sobat bisa langsung klik disini

Sekian Tips dari saya. Jika ada pertanyaan atau saran, silahkan beri komentar yang sopan di bawah.

Tidak ada komentar:

Posting Komentar