June 14, 2011

Tutorial: Scrollbar


In today's tutorial, I'll be showing you how to make your scrollbar look unusually pretty. This tutorial has been requested by my fellow classmate.

1. Dashboard -> Design -> Edit HTML
2. Find this code, -> ]]></b:skin>
3. Copy the code below and paste it before the previous code.

::-webkit-scrollbar {
width: 12px;
background: #D9D9D9;
::-webkit-scrollbar-thumb {
background-color: #B2C0C6;-moz-border-radius: 10px;
border-radius: 10px;

Red : You can change with whatever you like. Look here.
Green : You can replace that with the code below or leave it like that and change the colour.

background-image:url(URL IMG);

4. Click Preview and if you're happy with how it looks, go on and click Save Template.

Easy breezy lemon squeezy!

cc: Nazihah


  1. scrollbar tu yang colour kelabu dekat tepi blog saya tu... alahai, yang benda untuk naik turun kan page tu... sekarang dah faham?

  2. hyee , scrollbar nie nice lhaa ! thnx , dye da wat blog sye jd perfect ! tq (:

  3. Banyak beno komennyew... Ni aku tambah lagi. lalala~


~ Mind your words. I ain't dealing with rude people. ~