Top Commentators Cloud Widget For Blogger

By adding top commentators cloud widget you can reward your top commentators.It will increase number of commentators on your blog.This widget works in increasing order.If any readers commented most then his/her name will display in large letters with link to his/her profile.This gadget was developed by Greenlava by using yahoo pipes.Comments are sourced from comments feed and processed via Yahoo Pipe.Now lets see how to add this gadget to your blog.

How To Add Top Commentators Cloud Widget To Blogger?

1. Login to your Blogger account.
2. Go to Design > Page Elements.
3. Click Add A Gadget.
4. In Add A Gadget window, select HTML/Javascript .
5. Enter the title of your widget e.g. Commentators Cloud.
6. Copy the code below and paste it inside the content box.
7. Click Save.

<!-- Top Commentators Cloud Start
(c) 2010 Blogger Sentral. Original code by http://www.bloggersentral.com/. Please do not remove this credit and the “Get this commentators widget” link at the bottom of the code.-->
<div style="text-align:justify;line-height:1.2;">
<script type="text/javascript">
function cCloud(feed) {
max = 0;
min = 10000;
//finding highest and lowest count
for (i=0;i<feed.count;i++)
{
ccCount = feed.value.items[i].commentcount * 1;
if (ccCount > max)
{
 max = ccCount;
}
if (ccCount < min)
{
 min = ccCount;
} 
} 
ccCountD = "";
display = "";
for (j=0;j<feed.count;j++)
{
ccdiff = feed.value.items[j].commentcount - min;
ccFontsize = 80 + (ccdiff * 100) / (max - min) + "%";
ccUrl = "'" + feed.value.items[j].authorurl + "'";
ccCountD = "(" + feed.value.items[j].commentcount + ")";//comment count
ccName = feed.value.items[j].title + ccCountD;
ccLName = "<a style='font-size:" + ccFontsize + "' href=" + ccUrl + " target='_blank'>" + ccName + "</a>";//clickable commentator name
display = display + ccLName + " ";
}
document.write(display);
}
</script>
 <script src="http://pipes.yahoo.com/pipes/pipe.run?
 YourBlogUrl=http://www.helperblogger.com
 &Exclusions=Anonymous,Rahul
 &ShowHowMany=20
 &Order=alphabet
 &_callback=cCloud
 &_id=cfa196644e1d6159c9183548c4b5e2f5
 &_render=json" 
type="text/javascript"></script>
</div>
<span style="font-size: 80%; float:right;;margin-top:5px;">Get this <a href="http://www.bloggersentral.com/2010/02/top-commentators-cloud-widget.html" target="_blank">commentators</a> <a href="http://www.helperblogger.com/" target="_blank">widget</a></span>
<!-- Top Commentators Cloud End -->

2. Customizing Commentators Cloud

Notice the highlighted items in the code? That’s where you need to enter your own inputs:

1. YourBlogUrl (Highlighted in Red color)
   This is your blog URL, replace http://www.helperblogger.com with yours. Make sure you omit the slash at the end of the URL (as in .com/).
   
2. Exclusions  (Highlighted in Lime color) 
   List the commentator names you want to exclude from the cloud. Separate each name with a comma, and don’t put space between them.
   
3. ShowHowMany  (Highlighted in Yellow color)  
   Specify how many top commentators you want to appear in the cloud.
   
4. Order  (Highlighted in Faint Green color) 
   Enter alphabet if you want to arrange the names alphabetically.
   Enter frequency if you want to arrange them by frequency (with the most frequent commentators on top).
   
5. Comment count  (Highlighted in Faint Blue color) 
   Comment count (in bracket) is displayed by default. To remove it, just delete this line of code.  
6. Use our HTML Editor to make changes easily....