Add Blogger Cool Popular Posts Widget With Zoom Effect V3 / Using CSS


Yeah! This Is Cool Zoom Effect!
I'm Sure, Everyone Gonna Love This!
How To Add It?
Let's Follow This Simple Steps Below!

1. Log in to your Blogger Account > Dashboard > Design > Edit HTML
2. Click on CTRL+F and find  ]]></b:skin> tag!
3. Copy codes below and paste it after  ]]></b:skin>  tag!


<style type='text/css'>
.PopularPosts .item-title{display:none}
.PopularPosts ul li {background: none repeat scroll 0 0 transparent;float: left;list-style: none outside none;margin: 5px !important;padding: 0 !important;}
.PopularPosts ul li img {padding:0;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;border: 2px solid #CCC;height: 80px;width: 80px;}
.PopularPosts ul li img:hover {border:2px solid #BBB;-moz-transform: scale(1.2) rotate(-1090deg) ;-webkit-transform: scale(1.2) rotate(-1090deg) ;-o-transform: scale(1.2) rotate(-1090deg) ;-ms-transform: scale(1.2) rotate(-1090deg) ;transform: scale(1.2) rotate(-1090deg) ;}
</style>



P/S : Make sure, add Popular Posts Widget first in your Blogger Sidebar! Find it in your Blogger Widget lists!

4. Hit on "Save Template"!
5. Me recommend you to set your Popular Posts Widget just like this!

6. Save your Popular Posts Widget and you are done! Simple isn't it?


Sharing is simple! Make sure, drop some comment here! Thanks me if you had benefit from this post! If you have anything in mind, feel free to drop some comment here.. Just ask me if you have any problem with those codes.. Happy Blogging Guys! Follow me for the latest post and hacks!