How To Add Scroll Bar In Any Blogger Widget In Blogger

There are many widget, some widget occupy a lot of space in blogger.
For example Popular Post occupy a big space in the sidebar in which the space can be use for other widgets but if Scroll Bar is added, it will save the space and you can resize the widget to your desire.

This Scroll Bar can be added to other widgets like Related Post, Recent Post Widget etc. It is very useful for those using Text Related post widget which occupy a lot of space which may not display more  than 5 related posts but by adding the Scroll Bar Widget it would be able to display 20 related post or more

NOTE: If you check the Random Post Widget at the Footer of this Blog, i added scroll bar to it that what make it
to contain many Random Posts (40 Random Post) and you will notice that it occupy very small space in the footer.

By adding Scroll Bar Widget to your Popular Posts, Related Post, or Random Posts Widgets will help to decrease your blog template loading time(Increase Blog Speed).

Step 1 Log in to your Blogger Dashboard

Step 2 Click "Layout"

Step 3 Clicn on "Add a Gadget" and Select "HTML/Javascript"

Step 4 Now Copy below code and paste it in HTML/Javascript Gadget

<div style="overflow:auto; width:200px; height:300px;
padding:10px; border:1px solid #eee ;">
Widget Code Here
</div>

Customization

Change width:200px to change the Width
Change height:200px  to change the  Height
Change Border Color: eee to change the border color
Replace "Widget Code Here" with your widget HTML code

Feedback!

If you have any difficulty adding Scroll Bar to any of your widget or recommendation Comment Below!
if you find this post useful kindly share it