Gadgets, Tech tips, WordPress and Blogger Tutorials

Recent Comments Widget For Blogger (blogspot)

Candy Monster

Here’s how you can add a recent comments widget (gadget) to your Blogger blog. (You may also want to add a Recent Posts with Thumbnails widget to your blog.)

Steps:

1. Go to your Blogger Dashboard > Layout > Page Element > Add a Gadget > HTML/JavaScript

2. Copy and paste the code below:

CODE
<script style=text/javascript src=https://sites.google.com/site/projectdigitaltomato/blogger/js/rc1blogger.js ></script>
<script style=text/javascript >var a_rc=5;var m_rc=false;var n_rc=true;var o_rc=100;</script>
<script src=http://YourOwnB1og.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script>
<div style="font-family: arial, sans-serif; font-size: 9px;" id="rcdr"><a href=http://www.madtomatoe.com/recent-comments-widget-for-blogger/>Recent Comments</a> <a href=http://www.madtomatoe.com/ target=_blank title=blogger widgets>Blogger Widget</a></div><noscript>Your browser does not support JavaScript!</noscript>
<style type=text/css>  
.rcw-comments a {text-transform: capitalize;} 
.rcw-comments {border-bottom: 1px #cccccc dotted; padding-top: 7px!important; padding-bottom: 7px!important;}
#rcdr {background: url(http://3.bp.blogspot.com/-wsIqUGbMUyk/TchLsqCK3QI/AAAAAAAACmU/udeV22bGZ78/s400/blgo.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rcdr, #rcdr a {color:#808080;} 
</style>

3. In the code, look for this line:

…src=”http://YourOwnB1og.blogspot.com/feeds/comments/default…

…and replace the blog address (indicated in color blue) with your own blog address.

For blogs using custom domain…

…src=”http://www.YourOwnB1og.com/feeds/comments/default…

4. Add a title. Save.

That’s it!

Optional settings

How to change the number of comments

This widget is set to display 5 recent comments. If you want to change that number, just look for the number 5 in the code and replace it with the number of comments you want to be displayed. I recommend setting it to 5 to 8 comments.

… a_rc=5;var m_rc=false;var n_rc=true;var…

How to change the number of characters / hide excerpts

This widget is set to display a maximum of 100 characters of comment excerpt for each comment. If you want to change that number, just look for the number 100 in the code and replace it with the number of characters you want to be displayed. *

…n_rc=true;var o_rc=100;

*Recommended setting: 50 to 100.

If you want to hide the comment excerpts, just enter 0 (zero). Ex. …var o_rc=0

How to display the date of comments

If you want to show the dates of comments, look for this line:

… a_rc=5;var m_rc=false;var n_rc=true;var…

and replace the false with true.

Display only the comment author and the comment

Use this code if just want to show only the commenters’ names and their comments. The title of the post will be hidden.

CODE
<script style=text/javascript src=https://sites.google.com/site/projectdigitaltomato/blogger/js/rc1blogger-cut.js >
</script><script style=text/javascript >var a_rc=5;var m_rc=false;var n_rc=true;var o_rc=100;</script>
<script src=http://YourOwnB1og.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments ></script>
<div style="font-family: arial, sans-serif; font-size: 9px;" id="rcdr"><a href=http://www.madtomatoe.com/recent-comments-widget-for-blogger/>Recent Comments</a> <a href=http://www.madtomatoe.com/ target=_blank title=blogger widgets>Blogger Widget</a></div><noscript>Your browser does not support JavaScript!</noscript>
<style type=text/css>  
.rcw-comments a {text-transform: capitalize;} 
.rcw-comments {border-bottom: 1px #cccccc dotted; padding-top: 7px!important; padding-bottom: 7px!important;}
#rcdr {background: url(http://3.bp.blogspot.com/-wsIqUGbMUyk/TchLsqCK3QI/AAAAAAAACmU/udeV22bGZ78/s400/blgo.png) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rcdr, #rcdr a {color:#808080;} 
</style>

If you liked this widget, you may also like to add a Recent Posts with Thumbnails widget to your blog.

This widget is compatible with any wordpress hosting service, but we always suggest to our visitors to select best web hosting as your blog/site performance depends a lot on hosting services.

PHOTO: doug88888/flickr

Get updates delivered straight to your inbox!

Enter your email address:

389 comments

  1. Thank You! Very helpful and easy-to-follow instructions!

  2. Hello,
    I have implemented my blog with the “recent comments” tool. I would like to know how is possible to replace the english term “wrote”, following the comment author’s name, with the italian one “ha scritto”.
    Thanks for your attention.

  3. very nice thanks for sharing

    hey friend see snow on google
    Type “Let It Snow” on Google If you click and drag you can wipe the snow away. It is great.

  4. jose medina /

    Felicidades por este magnifico trabajo,en la dibulgacion con el blogger y por tu trabajo en el Agility,me a encantado las fotos y los pequeños videos .Espero que cuelgues pronto alguno de Agility que ya estan por hay,felicidades de nuevo y te deseo que pronto se cumplan vuestras espectativas tanto con la raza como en el Agility,saludos

  5. Thanks for your tutorial. I have tried several other widgets but always go back to this one :-) as this is most reliable and comments shown fast.

Leave a Reply