Cara Mengganti Tampilan Scroll Bar di Blog
 |
| Cara Mengganti Tampilan Scroll Bar di Blog |
TENLIBRARY - Cara Mengganti Tampilan Scroll Bar di Blog - Selamat siang pembaca. Pada kesempatan kali ini saya ingin berbagi sedikit tutorial blog yang mudah-mudahan dapat bermanfaat. Yang saya akan bahas kali ini yaitu mengenai cara mengganti tampilan scroll bar di blog. Tentu dengan cara ini, tampilan antarmuka blog kamu akan semakin cantik.
Kamu bisa melihat demonya pada gambar diatas atau kamu juga dapat langsung melihatnya pada blog ini. Oke, langsung saja berikut tutorialnya.
Kamu bisa melihat demonya pada gambar diatas atau kamu juga dapat langsung melihatnya pada blog ini. Oke, langsung saja berikut tutorialnya.
IKUTI LANGKAH-LANGKAH BERIKUT
- Login ke akun blogger kamu.
- Pilih menu dropdown, kemudian pilih menu Template.
- Pilih Edit HTML.
- Klik pada bagian dalam kotak Edit HTML, kemudian tekan Ctrl + F pada keyboard. Setelah itu cari kode ]]><b:skin>.
- Selanjutnya copy/pastekan kode dibawah ini diatas kode ]]><b:skin>.
::-webkit-scrollbar {height: 10px;width: 10px;background: #ccc;}
::-webkit-scrollbar-thumb {background-color: #0066b3;
border-top: 20px solid #000000;border-bottom: 20px solid #000000;-moz-border-radius: 10px;border-radius: 0px;}
- Kemudian klik Simpan. Selesai.
CATATAN :
Kamu dapat melakukan beberapa perubahan pada kode tersebut sesuai kehendak kamu. Seperti :
- height: 10px : Merupakan kode untuk tinggi scroll bar.
- width: 10px : Merupakan kode untuk lebar scroll bar.
- backgorund-color: #0066b3 : Merupakan kode untuk warna background scrollbar.
- border-top: 20px solid #000000 : Merupakan kode untuk ketebalan serta jenis warna border atas scroll bar.
- border-bottom: 20px solid #000000 : Merupakan kode untuk ketebalan serta jenis warna border bawah scoll bar.
- border-radius: 0px : Merupakan kode untuk merubah bentuk lengkungan scroll bar. Jika tertulis "0px" berarti tidak terdapat lengkungan dari scroll bar tersebut alias scroll bar berbentuk kotak. Akan tetapi jika kamu mengubahnya menjadi "5px" (misalkan), scroll bar tersebut dapat berbentuk rounded.
Sekian postingan kali ini. Semoga dapat bermanfaat dan dapat diterapkan dengan mudah ~
Kamu sedang membaca artikel tentang Cara Mengganti Tampilan Scroll Bar di Blog dan kamu bisa menemukan artikel Cara Mengganti Tampilan Scroll Bar di Blog ini dengan url http://tenlibrary.blogspot.com/2013/07/cara-mengganti-tampilan-scroll-bar-di_6.html. Kamu boleh menyebarluaskan atau mengcopy artikel Cara Mengganti Tampilan Scroll Bar di Blog ini jika memang bermanfaat bagi kamu,namun jangan lupa untuk mencantumkan link sumbernya. Terimakasih.
Jika kamu menyukai Artikel di blog ini, Silahkan
klik disini untuk berlangganan gratis via email, dengan begitu kamu akan mendapat kiriman artikel setiap ada artikel yang terbit di TENLIBRARY
mksih tutorny sob, sudah saya tarpkan jga :D
BalasHapus-keep blogging-
Sama-sama sob. Salam blogger ~
Hapus