Popular posts widget is a best widget to show off your blog's popular posts of week,month or all time as you choose.After publishing our first blogger's official popular posts hack here we are publishing another cool hack.In this hack we have managed to reduce image thumbnail size and add a border to them.This hack will give a perfect look to your popular posts gadget and of course we have used pure Cascading Style Sheets (CSS) no any heavy scripts are used.To apply this hack you just have to add little snippets of CSS code and you are done.Let's watch yourself in image below.
 |
| Gadget Preview |
How To Apply This Hack?
Before applying this hack you have to do the widget settings as I have done in below image.
- Now Go to Blogger Dashboard > Design > Edit HTML.
- Backup your template first.
- Now search for
]]></b:skin>
add below code just above it
.PopularPosts .item-thumbnail {
padding: 3px;
border: 1px solid #999;
background-color: #fff;
}
.PopularPosts img {
height: 36px;
width: 36px;
}
.PopularPosts .widget-content ul li {
list-style: none;
}
Now save your template and you are done.
If you have any queries or questions then feel free to post them below.I hope you will like this little hack also while sharing this hack with your readers don't forgot to attach a link to this article.
SHARE BLOGGER STICKY BAR WIDGET CODE
ReplyDeleteHi Daniyal,
ReplyDeleteI am not using stickybar I am using hellobar.
You can get your own @ hellobar.com
very nice,thank you.Blog Okulu
ReplyDeleteThanks for your comment.It will better if you don't add links in comments as they are considered as spam.
Deletecan you tell me how to fix summary of popular posts?
ReplyDeleteThanks buddy
ReplyDeleteThanks Bro for this nice tutorial. :)
ReplyDeletehere chek this http://pakistangoogle.blogspot.com/
ReplyDeletehow can i change color of line between posts?
ReplyDelete