Cara Membuat Widget Top Komentator dengan Avatar di Blog

Assalamualaikum Wr. Wb.
Kali ini Saya Admin MONSTER 48 Akan NgepostTutorials Cara Membuat Widget Top Komentator di Blog Widget ini berguna untuk memberikan penghargaan kepada para Komentator yang sering berkomentar di Blog Sobat.

Cara Memasangnya :

• Log In ke Akun Blogger Sobat.
• Lalu Pilih Tempat, Apakah mau ditempatkan di Laman atau di Postingan. 
• (Laman : Laman>>Laman Baru>>Laman Kosong) (Postingan: Buat Entri Baru atau menu Pensil)
• Lalu Ubah Tab Halaman Laman/Entri menjadi HTML ingat Jangan Compose.
• Lalu Copy Paste kan Kode HTML/JavaScript berikut ke Halaman kosong tersebut. 

<br /><style type="text/css">.top-commenter-line img {-webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .4); box-shadow: 0 1px 3px rgba(0, 0, 0, .4);margin-left:5px;margin-right:5px;}.top-commenter-line {margin: 5px 0;border-bottom:1px solid #eee;padding:3px 5px 6px 0px;}.top-commenter-line .profile-name-link {padding-left:0;font-weight:bold;}.top-commenter-avatar {vertical-align:middle;width:30px;height:30px;}</style><script type="text/javascript">//// Top Commentators gadget with avatars, by Esbepe 2013.// Gets a list of top commentators from all comments, or specified number of days in the past.// See http://esbepe-sbp.blogspot.com/2013/07/cara-membuat-widget-top-komentator-di-Blog-Terbaru.html// Thanks MS-Potilas 2012//// CONFIG:var maxTopCommenters = 5;   // how big a list of top commentatorsvar minComments = 1;        // how many comments must top commentator have at leastvar numDays = 0;            // from how many days (ex. 30), or 0 from "all the time"var excludeMe = true;       // true: exclude my own commentsvar excludeUsers = ["Anonymous", "Nama Kamu"];     // exclude these usernamesvar maxUserNameLength = 42; // 0: don't cut, >4: cut usernames//var txtTopLine = '<b>[#].</b> [image] [user] ([count])';var txtNoTopCommenters = 'No top commentators at this time.';var txtAnonymous = '';      // empty, or Anonymous user name localized if you want to localize//var sizeAvatar = 56;var cropAvatar = true;//var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhepyXhWBpmfB7jKk9SVO5ycSMPH3Qg34IoyP8N7dyUFqmxmr_nR1Ds3Mt4VYXgdfZNDhJeOoP0IbkLDyE4_aru0j3fthcdSrMmFXrDDsiVFLwK0q-ZPOSSMWc_7Zmlox5iQ8QgmK6u-Ho/"+sizeAvatar+"/avatar_blue_m_96.png"; // http://www.blogger.com/img/avatar_blue_m_96.png resizeablevar urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar;var urlMyProfile = ''; // set if you have no profile gadget on pagevar urlMyAvatar = '';  // can be empty (then it is fetched) or url to image// config end// 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(/\/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 = '<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;      }  } 
  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.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><br /><small><a target="_blank" href="http://esbepe-sbp.blogspot.com/2013/07/cara-membuat-widget-top-komentator-di-Blog-Terbaru.html" title="Top Commentator From This Blog"></a></small>

1. Yang Berwarna Biru Kamu Ganti Dengan Angka Sesukamu
2. Yang Berwarna Merah Kamu Ganti Dengan Nama Kamu
3. Terus Kamu Simpan Deh..??

Nah Begitulah cara pembuatan Widget Top Komentator Jangan Lupa Like Ya.!!

Cara Membuat Widget Top Komentator dengan Avatar di Blog 9 Out Of 10 Based On 10 Ratings. 9 User Reviews.

Share This To :

• Facebook
• Twitter
• Google+
• StumbleUpon
• Digg
• Delicious
• LinkedIn
• Reddit
• Technorati

Anda baru saja membaca artikel yang berkategori Tutorial Blog dengan judul Cara Membuat Widget Top Komentator dengan Avatar di Blog. Anda bisa bookmark halaman ini dengan URL https://mickeym4ru.blogspot.com/2013/11/cara-membuat-widget-top-komentator.html. Terima kasih!

Ditulis oleh: Unknown - Selasa, 26 November 2013