Recent Comments Widget for Blogger / Blogspot

Displaying recent comments in the sidebar of a blog is one of the common trends. It can be used to show how much active a site it. It can also be used to encourage visitors to comment in the blog. Hence, a lot of bloggers prefer to display the recent comments made in their blog posts.

When you host a blog in Blogger / Blogspot, you can add gadgets which will add some additional functions to the sidebar of your website. Unfortunately, there isn’t an official gadget which allows us to display the latest comments made in the blog. Luckily for us, Blogger does publish comments in the Blogger comment feeds. We can use the same feed to display the latest comments in the sidebar.

Simplest Method to Add Recent Comments in Blogger / Blogspot

In this method, we will use the Blogger published comment feed and display it with the help of the official feed publishing gadget. Follow these steps to do so:

1. Get your comment feed url.
2. For *.blogspot.com blogs, the feed url is-
   http://yourblog.blogspot.com/feeds/comments/default
   For Blogger blogs using top-level domain name, the feed url is-
   http://www.yourblog.com/feeds/comments/default
3. Go to your layout editor, select a location and click on “Add a Gadget” link.
4. From the list of gadgets, select the one that says “Feed”. This gadget is used to display RSS feeds in your blog. Hit the ‘+’ button to add the gadget.
5. In the next step, you are required to enter a feed URL. Enter the feed URL we figured out in step 1. Hit continue.
6. In the next step, you can configure how may comments to display, whether or not to display item dates and comment authors. You can also configure to open the link in a new window.
7. Hit save. This new gadget will display a text snippets from the most recent comments and link it to their respective posts.

Recent Comments with Avatars in Blogger / Blogspot

If you want an advanced recent comments widget / gadget / plugin with better formatting and avatars, you will have to use some third party gadgets. These gadgets will use JavaScript to configure the display of comments. User avatars, if they have commented from Google accounts will be displayed along side their name and comments. Anonymous avatars will be different. A preview of it can be seen on the left.

To display advanced recent comments with avatars in the sidebar of your Blogger blog, do the following:

1. Go to your blog’s layout editor.
2. Click on “Add a Gadget” link at the part of the template where you want to display recent comments.
3. Find the gadget “HTML/JavaScript”. Click on ‘+’ button to add it to your template.
4. Give your gadget a title like Recent Comments.
5. In the content part of your gadget, enter the following code, hit save and you are done.

   <script type="text/javascript" src="https://www.googledrive.com/host/0B9VnchIrte6hT1dJZTBFeXhCdU0/"></script>
   <style type="text/css">
   .rcomments li{padding:10px 0}
   .rcomments .rcimg{float:left;margin:0 5px 5px 0}
   .rcomments p{margin:5px 0 0}
   .rcomments .rcname strong{display:block}
   .rcomments .rcdate{font-size:10px}
   </style>
   <div id="recentcmnts"></div>
   <script type='text/javascript'>
   //<![CDATA[
   RecentComment({
   numofcomments:5,
   imagesize:50,
   commentsize:100,
   adminname:""
   });
   //]]>
   </script>

In the above code, the text in blue are configurable. Change their values to what your want.
Note: For the code above to work, jquery must already be included in your template.

Just note that

• numofcomments: 9 means that 9 comments are shown.
• imagesize:50 tells the script to set the size of the avatar to 50px X 50px.
• commentsize:100 is to configure the length of comment snippet. In this case it is 100.
• adminname:”Your Name” is to stop displaying your own comments in the recent comments widget. This will prevent that area to be overloaded with your comment replies.