Stylish recent comment widget with thumbnail



Recent Comments Widget With Avatar For Blogger
The Recent Comments Widget for Blogger displays recent blog comments on your sidebar.You can use this widget to display the recent comments of any blogger blog. In this widget we can show the Avatar of Commenter using. As you seen my Recent Comments Widget, this looks exactly same to my Recent Comments Widget.This widget is highly customizable. So that you can easily customize your recent comments widget.You can also set the default avatar image and much more things that you can easily customize.


SEE THE DEMO:






How To Add Recent Comments Widget for Blogger 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/43012082112/truebloggertricks.txt.js"></script><script src="http://truebloggertricks.blogspot.com/feeds/comments/default?alt=json&amp;callback=latest_recent_comments&amp;max-results=5" type="text/javascript"></script>

4. Now change truebloggertricks.blogspot.com with your own blog URL.


Customizations (Optional)


  • To change number of comments find this numComments = 5,
  • If you don't want to show avatar then find this code showAvatar = true
  • To change avatar size find this code avatarSize = 40
  • If you don't want to show rounded avatars then find this code roundAvatar = true
  • To set maximum number of characters find this code characters = 40
  • To show more link find this code and change value to true showMorelink = false
  • If you enable show more link value then you can change the text which shows more link.Find this code moreLinktext = "More »"
  • To change default avatar image find this code defaultAvatar = "http://www.gravatar.com/avatar/?d=mm

5. Now save you widget.

Now you should have a working Recent Comments Widget for Blogger With Avatar on your blog.
I hope you all will like this gadget. Do not forgot to share this widget with your friends.

7 comments:

  1. This comment has been removed by a blog administrator.

    ReplyDelete
  2. Thanks for sharing this bro. I had one but somehow it seems it's no longer working. But I'm glad its not the fault of my theme. Cheers

    Regards: WorldWebSurfers.com

    ReplyDelete
  3. Good article. well thinking about this article. thanks for sharing here with us.

    Boom Barriers
    Boom Barriers
    Gate Barriers
    Gate Barriers

    ReplyDelete
  4. Hello everyone,

    I have made a lot of experiments how could I display recent comments on my blog. Trying so many things and codes but most of them didn't work until I end up with http://mybloggersworld.blogspot.com. It was so amazing for as easy as 3 minutes, I figured it out by simply copying the codes provided and just replacing my Blogs URL, saved it and presto, it worked out just fine. And since it is very important to me having this recent comments posted, I decided to put my Recent Comment widget just below the Blog under Layout settings. By this way, anybody who browsed my Blog could somehow see the recent comment with ease. Why I am so happy with it? Well, this is because I am not a very techie type of guy who knows a lot of codes, perhaps a little bit busy with my graphics design tasks at work.

    Just recently, I'm a bit busy working out with the designs of my Blog. I just installed a new template and currently customizing it the way I wanted to as well as optimizing it because ranking is really too far from the real numbers of Google Ranking. So if you would like to see my Blog, please check it out and make some comments, I really love to hear from anybody around the world who would also love to share their ideas, insights, experiments and most specially experience.

    For those of you who would like or willing to to do Link Exchange with me, I am very happy to share with you and be part of my referral List which you can see in this Link below;

    http://maxginez3.blogspot.com/2011/01/acknowledged-referring-sites.html

    Wish to see more visitors to my blog and hopefully to gain more friends. You can also follow me and I will follow you as well. I am also very willing to be a blogging partner with anyone just like writing an article to review a friend's Blog. Somehow this will also help us out in improving a SEO as well. Please don't hesitate to contact me on my personal blog because I will respond to you the soonest.

    Thank you and have a blessed day to everyone.

    Sincerely,

    Max

    ReplyDelete
  5. Good blog and the contents are really nice, thanks for sharing here with us.

    parking management
    parking guidance
    parking counting

    ReplyDelete
  6. Thank you. I tried many a "recent comments" widget but none worked til yours.

    ReplyDelete

Please don't spam. We hate spammers