How to Change Popular Posts widget in Blogger?

Blogger apiece constituent is customize-able with CSS and JavaScript. There are many widgets in Blogger that you might want to modify or make them looking more beautiful. And one of theme is popular posts widget in Blogger.

Let’s set up the things to do in this class. Follow easy steps above in order to change your popular posts widget in Blogger:

1.       Log-in to your blogger dashboard

2.      Go to the blog’s Template page

3.      Click HTML >> Proceed

4.      Now search for this code: ]]>  by using  CTRL+F

5.      Just above/before ]]> paste the below codes

"  .popular-posts ul{padding-left:0px;}

.popular-posts ul li {background: #FFF url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNqoqEd12sZLXU0Ng4R9dhSGq3x-t0uUssclNydFTVN5m2MQyUu0o87zUt4oziagEVUVdR4eWYfY9wUHFmEBETcB8QfoKTFUGBOfoyKzF6-O8vhZnILdHEPu_nfhCjhjDAcxkE_AwOwuk/s1600/1.gif) no-repeat scroll 5px 10px;
list-style-type: none;
margin:0 0 5px 0px;
padding:5px 5px 5px 20px !important;
border: 1px solid #ddd;
border-radius:10px;
-moz-border-radius:10px;
-webkit-border-radius:10px;
}
.popular-posts ul
li:hover {
border:1px solid #6BB5FF;
}
.popular-posts ul
li a:hover {
text-decoration:none;
}
.popular-posts .item-thumbnail img {
webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
box-shadow: 0 1px 3px rgba(0, 0, 0, .4);
}

"

Save your blog’s template and you’re done!

To add the popular posts widget in blogger just go  Layout >> Add a Widget and add the popular posts widget from the widget list and make any setting as you want.