Top commenter widget in blogger 2013
Hi my friend i want to tell u now about how u can add a top commenter widget in your blog. It is very stylish widget for your blog. You can fully satisfied to view top commenter of your blog.
.PNG)
2nd step: then Add A Gadget
3rd step: Then add a HTML/JavaScript
4th step: Then copy bellowing code & paste it HTML/JavaScript
You can customize that widget
How to add this widget in your blog?
1st step: log in your blog account & then go to Layout
3rd step: Then add a HTML/JavaScript
4th step: Then copy bellowing code & paste it HTML/JavaScript
<div id="topkoment">
<style type="text/css">
.top-commenter-line {margin: 0px;border-bottom: 1px solid #ccc;background-color: rgba(206, 206, 206, 0);padding: 5px 3px;}
.top-commenter-avatar {display:inline-block;vertical-align:middle;}
#topkoment {width: 300px;border: 1px solid #ccc;}
#topkoment a {color: #B10C0C;margin-left: 10px;}
.profile-name-link {padding-left: 2px;}
</style>
<script type="text/javascript">
// Top Commentators gadget with avatars, By http://tech-everyday.blogspot.com 2013.
// Gets a list of top commentators from all comments, or specified number of days in the past.
// http://www.blogshear.com/2013/06/stylish-top-commentators-widget-blogger.html
// CONFIG:
var maxTopCommenters = 10, // How much?
minComments = 1, // How many comments must top commentator have at least
numDays = 0, // From how many days (ex. 30), or 0 from "all the time"
excludeMe = true, // true: exclude my own comments
excludeUsers = ["Anonymous", "someothertoexclude"], // Exclude these usernames
maxUserNameLength = 42, // 0: dont cut, >4: cut usernames
txtTopLine = <div style="font-weight:bold;display:inline-block;width:2em;text-align:right;"><b>[#].</b></div> [image] [user] ([count]), // List number
txtNoTopCommenters = No top commentators at this time.,
txtAnonymous = , // Empty, or Anonymous user name localized if you want to localize
sizeAvatar = 32, // Avatar size
cropAvatar = true,
urlNoAvatar = https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_2XmbRpX8w9SIpHdZBpqJEukjEpasS8J6kGap_NFMSzQVGKdvc2YcfJaga4vv2h1MmO5futOaIXINwsjfnk475K6ioz7-YkumjwY0U6is-gB7w8rOAqrBpjhRLbTq-UY2onca4ivjDl8/ + sizeAvatar + /avatar_blue_m_96.png, // http://www.blogger.com/img/avatar_blue_m_96.png resizeable
urlAnoAvatar = http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s= + sizeAvatar,
urlMyProfile = , // Set if you have no profile gadget on page
urlMyAvatar = ; // Can be empty (then it is fetched) or url to image
// END CONFIG
// for old IEs & IE modes
if(!Array.indexOf) {
Array.prototype.indexOf=function(obj) {
for(var i=0;i<this.length;i++) if(this[i]==obj) return i;
return -1;
}}
function replaceTopCmtVars(text, item, position)
{
if(!item || !item.author) return text;
var author = item.author;
var authorUri = "";
if(author.uri && author.uri.$t != "")
authorUri = author.uri.$t;
var avaimg = urlAnoAvatar;
var bloggerprofile = "http://www.blogger.com/profile/";
if(author.gd$image && author.gd$image.src && authorUri.substr(0,bloggerprofile.length) == bloggerprofile)
avaimg = author.gd$image.src;
else {
var parseurl = document.createElement(a);
if(authorUri != "") {
parseurl.href = authorUri;
avaimg = http://www.google.com/s2/favicons?domain= + parseurl.hostname;
}
}
if(urlMyProfile != "" && authorUri == urlMyProfile && urlMyAvatar != "")
avaimg = urlMyAvatar;
if(avaimg == "http://img2.blogblog.com/img/b16-rounded.gif" && urlNoAvatar != "")
avaimg = urlNoAvatar;
var newsize="s"+sizeAvatar;
avaimg = avaimg.replace(//sdd+-c//, "/"+newsize+"-c/");
if(cropAvatar) newsize+="-c";
avaimg = avaimg.replace(//sdd+(-c){0,1}//, "/"+newsize+"/");
var authorName = author.name.$t;
if(authorName == Anonymous && txtAnonymous != && avaimg == urlAnoAvatar)
authorName = txtAnonymous;
var imgcode = <img class="top-commenter-avatar" height="+sizeAvatar+" width="+sizeAvatar+" title="+authorName+" src="+avaimg+" />;
if(authorUri!="") imgcode = <a href="+authorUri+">+imgcode+</a>;
if(maxUserNameLength > 3 && authorName.length > maxUserNameLength)
authorName = authorName.substr(0, maxUserNameLength-3) + "...";
var authorcode = authorName;
if(authorUri!="") authorcode = <a class="profile-name-link" href="+authorUri+">+authorcode+</a>;
text = text.replace([user], authorcode);
text = text.replace([image], imgcode);
text = text.replace([#], position);
text = text.replace([count], item.count);
return text;
}
var topcommenters = {};
var ndxbase = 1;
function showTopCommenters(json) {
var one_day=1000*60*60*24
var today = new Date();
if(urlMyProfile == "") {
var elements = document.getElementsByTagName("*");
var expr = /(^| )profile-link( |$)/;
for(var i=0 ; i<elements.length ; i++)
if(expr.test(elements[i].className)) {
urlMyProfile = elements[i].href;
break;
}
}
if(json && json.feed && json.feed.entry && json.feed.entry.length) for(var i = 0 ; i < json.feed.entry.length ; i++ ) {
var entry = json.feed.entry[i];
if(numDays > 0) {
var datePart = entry.published.$t.match(/d+/g); // assume ISO 8601
var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);
//Calculate difference btw the two dates, and convert to days
var days = Math.ceil((today.getTime()-cmtDate.getTime())/(one_day));
if(days > numDays) break;
}
var authorUri = "";
if(entry.author[0].uri && entry.author[0].uri.$t != "")
authorUri = entry.author[0].uri.$t;
if(excludeMe && authorUri != "" && authorUri == urlMyProfile)
continue;
var authorName = entry.author[0].name.$t;
if(excludeUsers.indexOf(authorName) != -1)
continue;
var hash=entry.author[0].name.$t + "-" + authorUri;
if(topcommenters[hash])
topcommenters[hash].count++;
else {
var commenter = new Object();
commenter.author = entry.author[0];
commenter.count = 1;
topcommenters[hash] = commenter;
}
}
if(json && json.feed && json.feed.entry && json.feed.entry.length && json.feed.entry.length == 200) {
ndxbase += 200;
document.write(<script type="text/javascript" src="http://+window.location.hostname+/feeds/comments/default?redirect=false&max-results=200&start-index=+ndxbase+&alt=json-in-script&callback=showTopCommenters"></+script>);
return;
}
// convert object to array of tuples
var tuplear = [];
for(var key in topcommenters) tuplear.push([key, topcommenters[key]]);
tuplear.sort(function(a, b) {
if(b[1].count-a[1].count)
return b[1].count-a[1].count;
return (a[1].author.name.$t.toLowerCase() < b[1].author.name.$t.toLowerCase()) ? -1 : 1;
});
// list top topcommenters:
var realcount = 0;
for(var i = 0; i < maxTopCommenters && i < tuplear.length ; i++) {
var item = tuplear[i][1];
if(item.count < minComments)
break;
document.write(<di+v class="top-commenter-line">);
document.write(replaceTopCmtVars(txtTopLine, item, realcount+1));
document.write(</d+iv>);
realcount++;
}
if(!realcount)
document.write(txtNoTopCommenters);
}
document.write(<script type="text/javascript" src="http://+window.location.hostname+/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></ + script>);
</script>
</div>
You can customize that widget