How To Add Customize Scroll Bar in Your Blogger Blog (Blogspot widget)

Nowadays Blogger blog (or blogspot) is the most popular blog designing platform provided by Blogger. Most of the blogger begins with the blogger blog for sharing and for many purpose by posting into their blog.

And all of us blogger wants to decorate our blog very beautifully, so visitors and people can be attracted. Many bloggers have seen many customized scroll bar in popular blog and wants to customize their blog with beautiful scrollbar,but dont know how to do? 

So, Today i am here to share Customizable Scrollbar script for the blogger. Hope this tip or customizable scrollbar you will like, And it is very quick and easy to customize the colors, size (width and height). This can be done by adding script (Which is given at the middle of the post) into the CSS code. 

Lets customize the Scroll bar.

• First Go to Blogger Dashboard.
• Now click on template >> Edit HTML.
• Now search for this code ]]></b:skin> using ctrl+f button.
• Now Copy the Below code and just paste above ]]></b:skin> .

/* startingphaseofc.blogspot.com scrollbar effect */ ::-webkit-scrollbar { width:8px; height:6px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.3); background:#eee; } ::-webkit-scrollbar-thumb { background: rgba(28,119,229,0.7); -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); } ::-webkit-scrollbar-thumb:window-inactive { background: rgba(116,188,99,0.5);

• Now click on save template and its done.

OR you also can do this with following method.

• First go to Blogger dashboard.
• And click on Template >> Customize button.
• Now click on Advance >> Add CSS and you will see 'Add custom CSS' and box now just paste above code.
• Now click on Apply to Blog Button and its done.

NOTE:

You can change the color by changing #eee and width and height by changing width:8px; height:6px; with your desired size.