Recent Comments Widget with Avatars for Blogger

Recent Comments Widget with Avatars for Blogger

After successful releasing of Auto Scrolling Recent post widget. As I am very happy for your positive response on auto scrolling posts widget. So today I have another great widget for you. I already shared two recent posts widgets and tons of Social widgets with our readers. That's why today I have Recent Comments widget. There are many recent comments widgets are available on the internet. So that's why i have decided to share something cool and decent with our readers. Today our widget will be Recent Comments Widget with Avatars for Blogger.

Why to Add Recent Comments Widget with Avatars to Blogger 

Recent Comments Widget with Avatars for Blogger

Comments are also a very important thing to judge a blog. If a blog have 200 posts and have no comments then it will raise alarm to advertisers as well as to new visitors. So If you want to make a good commenting family you must have cool recent comments widget. This widget is perfect for that because of its Avatar feature it can attract new visitors to comment. It also give a professional look to your blog. You can also set an avatar for visitors who don't have any avatar on their profiles or for anonymous users. This widget also shows some of the content of comment.

How to Add Recent Comments Widget with Avatars to Blogger

1. Go to Blogger Dashboard >> Layout >> Add a Gadget >> HTML/Javascript.

2. Paste the following code in HTML/Javascript box.

 <style type="text/css">
ul.w2b_recent_comments {
    list-style: none;
    margin: 0;
    padding: 0;

.w2b_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;

.w2b_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;

.w2b_recent_comments li img {
    padding: 0px;
    position: relative;
    overflow: hidden;
    display: block;

.w2b_recent_comments li span {
    margin-top: 4px;
    color: #666;
    display: block;
    font-size: 12px;
    font-style: italic;
    line-height: 1.4;
<script type="text/javascript">
    // Recent Comments Settings
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 60,
 roundAvatar = true,
 characters  = 40,
 showMorelink = false,
 moreLinktext = "More »",
 defaultAvatar  = "",
 hideCredits = true;
<script type="text/javascript" src=""></script>
<script type="text/javascript" src=""></script>

3. Change the highlighted text according to your blog.

4. Now click on save.

Last Words

We are working on a newer version of this widget. Hope you people like this widget. Do share your views about it. If you need any help regarding to this widget then just drop comments in comment box. Subscribe to Bloggiks to get free email updates directly to your inbox.

Get free daily email updates!

Follow us!

About Author:

Waleed is a certified SEO Consultant, Pro Blogger and an addicted Web Developer


Follow him @ Bloggiks |Mobi2Android | Facebook | Google Plus


  1. Nice widget bro keep on sharing loving it

  2. Very Good Widget Bro :) Thanks for sharing bro :)

  3. Replies
    1. I am happy that you find this widget useful.

  4. great bro but wordpress have already this widget :P

    1. yes we know that it is available for word press that's why we shared it for our blogger readers.

  5. in the beginig there was some errors... but ya now its working nicely.... Thank you for the help....... Make Money , Blogging Tips



About Me

My Photo

A Pro Blogger
Waleed khan is a young Blogger and Web Security Consultant.He is a SEO Consultant & Web Developer.


Recent Post

Recent Comments

Powered by:

Bloggiks © 2012. All Rights Reserved | Contact | About | Discliamer