1. Locate your Gadget ID#
2. Go to Design--> Template Designer--> Advanced--> Add CSS--> Input code below
#GadgetID .widget-content {
height: 400px;
overflow: auto;
}
4. Replace the GadgetID with the one you just found in step 1height: 400px;
overflow: auto;
}
5. Change the height size to whatever you want.
After your done it should look something like this.
#LinkList2 .widget-content {
height: 400px;
overflow: auto;
}
(Optional )height: 400px;
overflow: auto;
}
You can add something to change the colors of the scroll bar but this only works in Internet Explorer. All other browsers will just display as your normal gray scroll box.
To add color effects to the scroll bar just add this code below just below the overflow: auto;
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#000000;
scrollbar-base-color:#00ff00;
scrollbar-darkshadow-color:green;
scrollbar-face-color:00ff00;
scrollbar-highlight-color:lime;
scrollbar-shadow-color:lime;
scrollbar-arrow-color:#000000;
scrollbar-darkshadow-color:green;
scrollbar-face-color:00ff00;
scrollbar-highlight-color:lime;
scrollbar-shadow-color:lime;
Example:
#LinkList2 .widget-content {
height: 400px;
overflow: auto;
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#000000;
scrollbar-base-color:#00ff00;
scrollbar-darkshadow-color:green;
scrollbar-face-color:00ff00;
scrollbar-highlight-color:lime;
scrollbar-shadow-color:lime;
}
Just play around with the colors to get them to your liking.
#LinkList2 .widget-content {
height: 400px;
overflow: auto;
scrollbar-3dlight-color:#000000;
scrollbar-arrow-color:#000000;
scrollbar-base-color:#00ff00;
scrollbar-darkshadow-color:green;
scrollbar-face-color:00ff00;
scrollbar-highlight-color:lime;
scrollbar-shadow-color:lime;
}
Tried on my blog (PopularPost), but on IE it didn't work quite well. Some image thumbnail came out of the scroll box. Just undo the css adding.
ReplyDeleteI never tried it with a popular post gadget but I will look into it.
ReplyDeleteI got it, unchecked image thumbnail and it works perfectly without thumbnails. Thanks for the code
ReplyDeleteThanks for the heads up!
ReplyDeleteBlogWalking, Thanks for this Tips, Nice Blog.
ReplyDeleteWow - i found your blog last night - thanks for this great tip!
ReplyDelete