Home » , , , , , , , » HOW TO CREATE A RECENT COMMENTS WIDGET

1 HOW TO CREATE A RECENT COMMENTS WIDGET

A blog/website without a good quality comment is like eating without drinking. But it is not easy to encourage your reader to give comment on your blog therefore you need to encourage them to do so by creating "Recent Comment" and place it on your front page.

The function of a "Recent Comment" is not just to encourage your reader to leave a comment to your post but it also help you to increase your page view.

This recent comment use JavaScript. Checkout this picture bellow


Simply follow the steps on how to create you own version of the "Recent Comment" widget on your blogger blog.

  • First is to Log-in on your Blogger account
  • Click Design
  • Under Design Go to Page Elements
  • Create a new "Widget" named "Recent Comments" or whatever you want your gadget named. :)
  • Copy the code below and paste it on the "widget box" (NOTE change the URL address indicated on the code as www.yourdomainname.com and everything else done. :)

<ul><script style="text/javascript"> function showrecentcomments(json) { for (var i = 0; i < 5; i++) { var entry = json.feed.entry[i]; var ctlink; if (i == json.feed.entry.length) break; for (var k = 0; k < entry.link.length; k++) { if (entry.link[k].rel == 'alternate') { ctlink = entry.link[k].href; break; } } ctlink = ctlink.replace("#", "#comment-"); var ptlink = ctlink.split("#"); ptlink = ptlink[0]; var txtlink = ptlink.split("/"); txtlink = txtlink[5]; txtlink = txtlink.split(".html"); txtlink = txtlink[0]; var pttitle = txtlink.replace(/-/g," "); pttitle = pttitle.link(ptlink); 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('<li>'); document.write('<a href="' + ctlink + '">' + entry.author[0].name.$t + '</a>'); document.write(' on ' + pttitle); document.write('<br/>'); if (comment.length < 100) { document.write(comment); } else { comment = comment.substring(0, 100); var quoteEnd = comment.lastIndexOf(" "); comment = comment.substring(0, quoteEnd); document.write(comment + '...<a href="' + ctlink + '">(more)</a>'); } } document.write('</li>'); document.write('<div style="font-size:75&percnt;;text-align:center"></div>'); } </script> <script src="http://www.yourdomainname.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments"> </script></ul>


  • Preview the layout of your page and when you are satisfied SAVE your new template and ENJOY! ^_^

NOTE: If you want to change the "number" of the comments that you want to appear on your blog change the amount in blue the default number of comments is 5.


Again if you have problems comments are much appreciated. ^_^

HAPPY BLOGGING!!

^_^

1 Response to "HOW TO CREATE A RECENT COMMENTS WIDGET"

  1. Great comments widget. Thanks for this :)

Post a Comment

back to top