Display Most Commented Posts on Blogger with Yahoo Pipe

In a blog we need to accentuate the very articles that we rely on to improve the reader's desire to explore our blog further. There are many ways that can be used in doing so, one of which is by way of display the most commented posts.

There is a very easy way of doing the things above, especially if our blog using blogger.com; using yahoo pipes, you don't have to think hard, but simply used in a simple manner that is like the following guidelines:

#1. From your blogger dashboard, select "Layout" menu, then specify the position of the most commented posts widget is placed.

#2. Press Add a Gadget button, and then select type of gadget "HTML/JavaScript".

#3. From configuration of "HTML/JavaScript", add javascript code as below, and then press the Save button.

<script type="text/javascript">
function stripTags(s,n) {return s.replace(/<.*?>/ig,"").split(/\s+/).slice(0,n-1).join(" ")}
function mostcommented(feed) {
var i;
for (i = 0; i < feed.count ; i++) {
 var postURL = "'" + feed.value.items[i].link + "'";
 var postTitle = feed.value.items[i].title;
 var postthumbnail = "<img src="+feed.value.items[i].postthumbnail+" />";
 var postDescription = feed.value.items[i].postdescription;
 var postComments = feed.value.items[i].commentcount;
 var postList = '<div class="most-commented"><ul><li><div class="comment-count">' + postComments + " Comment(s)</div>" + postthumbnail + "<a href="+ postURL + '">' + postTitle + "</a>"  + '<p>' +stripTags(postDescription,10)+'...</p>' + '</li></ul></div>';
 document.write(postList);
    }
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?
AddUrlHere=http://www.every1posts.blogspot.com/
&NumberofPosts=5
&_id=2cb5eb603ed55a6264ee1484e5fdd45c
&_callback=mostcommented
&_render=json"
type="text/javascript"></script>

Then your blog will show up Most Commented Posts widget, quite simple isn't it.

To specify address of blog that will be processed, replace "AddUrlHere = http://www.every1posts.blogspot.com/" with  "AddUrlHere = {your blog url}"; and to change the number of posts to be displayed, replace "NumberofPosts=5" with "NumberofPosts={number of post}"