Recent Comments Widget For Blogspot Users

Today, I am releasing the Recent Comments widget for blogspot user.

How is it different from the other Recent Comments widget?

The problem with other widgets is that the source code for them lies with the widget author and the authors often integrate it in within their own site. If because of some problem their site is down, the recent comments widget will not work.

Here, I am releasing the source code so that the logic would reside within your blog itself and hence you can do away with dependency on 3rd party site not under your control.

How to install Recent Comments widget for blogger?

• Login to the blogger dashboard.

• Go to ‘Page Elements’ tab
• Click on Add a Gadget. Select HTML/Javascript widget type.

1. Now this is the most important step. Select the whole code given below and paste it in the widget box you have just opened above.
   

   <script style="text/javascript">
   function showrecentcomments(json) {
     var numcomments = 5;
   
     var showcommentdate = true;
     var showposttitle = true;
     var numchars = 100;
   
   for (var i = 0; i < numcomments; i++) {
       var entry = json.feed.entry[i];
       var alturl;
   
       if (i == json.feed.entry.length) break;
   for (var k = 0; k < entry.link.length; k++) {
   
         if (entry.link[k].rel == 'alternate') {
           alturl = entry.link[k].href;
           break;
         }
       }
   
      alturl = alturl.replace("#", "#comment-");
      var postlink = alturl.split("#");
      postlink = postlink[0];
   
      var linktext = postlink.split("/");
      linktext = linktext[5];
      linktext = linktext.split(".html");
      linktext = linktext[0];
   
      var posttitle = linktext.replace(/-/g," ");
      posttitle = posttitle.link(postlink);
      var commentdate = entry.published.$t;
      var cdyear = commentdate.substring(0,4);
   
      var cdmonth = commentdate.substring(5,7);
      var cdday = commentdate.substring(8,10);
      var monthnames = new Array();
   
      monthnames[1] = "Jan";
      monthnames[2] = "Feb";
      monthnames[3] = "Mar";
      monthnames[4] = "Apr";
   
      monthnames[5] = "May";
      monthnames[6] = "Jun";
      monthnames[7] = "Jul";
      monthnames[8] = "Aug";
   
      monthnames[9] = "Sep";
      monthnames[10] = "Oct";
      monthnames[11] = "Nov";
      monthnames[12] = "Dec";
   
      if ("content" in entry) {
        var comment = entry.content.$t;}
      else
   
      if ("summary" in entry) {
        var comment = entry.summary.$t;}
      else var comment = "";
   
   var re = /<\S[^>]*>/g;
      comment = comment.replace(re, "");
   document.write('<br/>');
      if (showcommentdate == true) document.write('On ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday + ' ');
   
   document.write('<a href="' + alturl + '">' + entry.author[0].name.$t + '</a> commented');
      if (showposttitle == true) document.write(' on ' + posttitle);
   
   document.write('<br/>');
   if (comment.length < numchars) {
   document.write('<i>');
   
            document.write(comment);
   document.write('</i>');}
      else
           {
   document.write('<i>');
   
            comment = comment.substring(0, numchars);
            var quoteEnd = comment.lastIndexOf(" ");
            comment = comment.substring(0, quoteEnd);
   document.write(comment + '...<a href="' + alturl + '">(more)</a>');
   
   document.write('</i>');}
   document.write('<br/>');
     }
   document.write('<br/>');
   
   }
   </script>
   <script src="http://xyz.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments">
   </script><a href="http://reviewofweb.com/blogging/recent-comments-blogspot-widget/">Widget </a>by <a href="http://reviewofweb.com/">ReviewOfWeb</a>
   
   

   
   


2. Scroll down to src=http://xyz.blogspot.com and replace xyz with your blog’s name. For example if your blog’s URL is http://abc.blogspot.com then the code should become src=http://abc.blogspot.com DO NOT TOUCH any other part of the code or else it might create problems.


3. You are done! Lastly please do not remove the footer credits*.

Please let me know if you face any problem implementing the code above.

Like the post above? I recommend you to subscribe via RSS Feed. You can also subscribe by email and have new articles sent directly to your inbox. It doesn't cost you anything!

Posted in: Blogger Tips,Tips n Tools