Widget Top người bình luận nhiều nhất cho Blogspot

 Hello các bạn đã quay trở lại với blog mình. Theo yêu cầu từ nhiều bạn thì hôm nay mình sẽ chia sẻ Widget Top bình luận mà mình đã test nó thành công mấy ngày qua :v Nó đơn giản chỉ là lọc số bình luận của từng ID rồi xếp hạng chúng chứ không dùng Host gì cả như nhiều bạn nói.

DEMO

Để thực hiện các bạn chỉ cần chèn đoạn code sau và nơi muốn hiển thị

<style type="text/css">
.so_cmt {background: #e8e8e8; color: #adabab; padding: 3px; border-radius: 10px; padding-left: 5px; padding-right: 5px}
.top-commentators b {border: 1px solid #4267b2; border-radius: 100%; padding: 6px; color: #fff; font-size: 13px; background: #4267b2; padding-left: 9px; padding-right: 9px}
.top-commentators a {color: #4267b2}
.top-commentators {
margin: 3px 0;
border-bottom: 1px dotted #ccc;
padding: 8px;
}
.avatar-top-commentators {
vertical-align:middle;
border-radius: 30px;
}
.top-commentators .commenter-link-name {
padding-left:0;
}
</style>
<script type="text/javascript">
var maxTopCommenters = 5;
var minComments = 1;
var numDays = 0;
var excludeMe = true;
var excludeUsers = ["Anonymous", "Trọng Khanh Nguyễn"];
var maxUserNameLength = 42;
//
var txtTopLine = '<b>[#]</b> [image] [user] <span class="so_cmt"><i class="fa fa-comment" aria-hidden="true"></i> [count]</span>';
var txtNoTopCommenters = 'No top commentators at this time.';
var txtAnonymous = '';
//
var sizeAvatar = 33;
var cropAvatar = true;
//
var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi68m4SrFptV4bMaBT4puxPamMiz8w6EEnuupUovGlqxWhuJkxhJejhjgSNFMs2w10WJlgS_B3GR7NEkEz2NNUeR103s8bu2UVEP7rcU-dd6-vFFHUmd_BnKAx9cxFGNdlv6RfXUNeNGJBx/s1600/avatar_blue_m_96.png" + sizeAvatar;
var urlAnoAvatar = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG5QYARQs-q3OCB3xlE63byKKO8hlOfOCmGrngAJCp82FPkaS6ZZW0biCPRzTN4JxkpWQlXnxdLVIUmMyyjCFBSt9RfbhaxcdHPAOpUcjCeCeZ482hPEN0FdzZRBqkspxzgsS9BxsISI-O/s1600/avatar1.png' + sizeAvatar;
var urlMyProfile = '';
var urlMyAvatar = '';
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 = 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(/\/s\d\d+-c\//, "/"+newsize+"-c/");
if(cropAvatar) newsize+="-c";
avaimg = avaimg.replace(/\/s\d\d+(-c){0,1}\//, "/"+newsize+"/");
var authorName = author.name.$t;
if(authorName == 'Anonymous' && txtAnonymous != '' && avaimg == urlAnoAvatar)
authorName = txtAnonymous;
var imgcode = '';
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="commenter-link-name" 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);
var cmtDate = new Date(datePart[0],datePart[1]-1,datePart[2],datePart[3],datePart[4],datePart[5]);

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;
}
// chuyen doi numtovar TKN
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;
});
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-commentators">');
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>

Chú thích:
Màu đỏ là số người mà bạn muốn hiển thị trên Top Bình luận
Màu tím là số ngày nó thống kê và lọc. Ở đây mình để 0 là lọc toàn thời gian, các bạn muốn chỉnh lại thì thay ở phần con số màu tím đó, VD 1 tuần thì chỉnh lại thành 7.
Phần in nghiêng các bạn thay thành tên không muốn hiển thị trên TOP BÌNH LUẬN, VD như tên các bạn chẳng hạn.

Tổng kết
Vậy là mình đã hướng dẫn xong các bạn cách tạo widget Top người bình luận cho Blogspot. Khi thêm cái này nó sẽ chỉ giảm 1 điểm SpeedInsights nên các bạn yên tâm sử dụng. Bạn nào khi chèn vào mà nó chưa hiện thì các bạn hãy chờ chút nhé ! Nó sẽ hiện ngay thôi vì đang lọc mà =)))

Chúc các bạn thành công !