Stylish Recent Comments Widget with Thumbnail Avatars For Blogger

Every Blogger wants their blog to look beautiful and professional. We add many blogger widgets to make it beautiful like Popular Posts, Animated Page Loading Effect etc. One of the must use widget is Recent Comments widget. By this widget we can show our visitors the most recent commentators and their comments. This widget also bring up more professional looks to your blog because it also shows thumbnails avatars along with the comment. This widget includes no JQuery or Javascript so it won't effect your blog loading speed. You can see that many popular blogs have recent comments widget on their sidebar it is because it attracts visitors to comment on the site. This is a must use widget as you can see this widget at our footer also. So if you like this widget and wants to add it to your blog then start rolling your fingers on it.

Adding Recent Comments Widget With Avatar To Blogger?

1, Go to Blogger Dashboard > Layout.
2. Click on Add a Gadget > HTML/JavaScript.
3. Paste below code and save it.

• <style type="text/css">    ul.latest_recent_comments{list-style:none;margin:0;padding:0;}    .latest_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}    .latest_recent_comments li .avatarImage{padding:3px;background:#fefefe;-webkit-box-shadow:0 1px 1px #ccc;-moz-box-shadow:0 1px 1px #ccc;box-shadow:0 1px 1px #ccc;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}    .avatarRound{-webkit-border-radius:100px;-moz-border-radius:100px;border-radius:100px;}    .latest_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}    .latest_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
  .latest_recent_comments span{display:none;}</style><script type="text/javascript">//<![CDATA[    // Recent Comments Settings    var    numComments     = 8,    showAvatar     = true,    avatarSize     = 60,    roundAvatar    = true,    characters     = 30,    showMorelink    = true,    moreLinktext    = "More &#65533;",    defaultAvatar     = "http://www.gravatar.com/avatar/?d=mm",    hideCredits    = true;//]]></script><script src="http://yourjavascript.com/12251714239/hacker-bicky.com.js"></script><script src="http://www.hacker-bicky.com/feeds/comments/default?alt=json&amp;callback=latest_recent_comments&amp;max-results=5" type="text/javascript"></script>

4. Now change hacker-bicky.com with your own blog URL.