Update Widget top komentar blogger dengan avatar - Ilmu Komputer

Tentang komputer, tips, trik, artikel, tutorial!

Rabu, 27 November 2013

Update Widget top komentar blogger dengan avatar


Widget top komentar
Update Widget top komentar blogger dengan avatar- Daripada gag update sama sekali mending update widget yang saya pakai aja kayak disamping =D.....
Moho maaf kalau sekiranya agan-agan sudah ada yang post artikel ini, tapi saya gag tau lagi sumbernya, soalnya sudah di CCleaner...
Ni langsung aja, demonya bisa agan liat di widget samping kanan blog ini, LINK SAHABAT
Tambah dulu widget HTML/Javascript, terus copy code berikut:
<style type="text/css">
.top-commentators {
margin: 3px 0;
border-bottom: 1px dotted #ccc;
}
.avatar-top-commentators {
vertical-align:middle;
border-radius: 10px;
}
.top-commentators .commenter-link-name {
padding-left:0;
}
</style>
<script type="text/javascript">
var maxTopCommenters = 8;   
var minComments = 1;        
var numDays = 0;            
var excludeMe = true;       
var excludeUsers = ["Anonymous", "Ilkom unived"];   
var maxUserNameLength = 42; 
//
var txtTopLine = '<b>[#].</b> [image] [user] ([count])';
var txtNoTopCommenters = 'No top commentators at this time.';
var txtAnonymous = ''; 
//
var sizeAvatar = 50;
var cropAvatar = true;
//
var urlNoAvatar = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg63sTCykJHm0j22aJUgBAZqW3A3ZqtFhyGwjNmvRM_FJRKGMFH3hXisrHx1PnPBrqN4XY5O2rfi7XYJhRCkxcNGXCJwX5fMe4er8wELSbG__ImAjq6PANBYMWm-Dr7asXy61BOVWCTgP8/s1600/images.jpg" + sizeAvatar;
var urlAnoAvatar = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnYImg7q1srSQ5LLHk1ll19JXzUXH_DIoS6Fel9SG4DusaLa-LViNe-kEV9Q9uk_ahKkK8fUZoOG52b2eMyLO5Mc1fJzQCPnCs8_M2VnxUW582P3eYGw26bSEB84ff913jQlj9Zw29W_tW/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 = 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="avatar-top-commentators" 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="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;
  }

  // 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;
  });

  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>
Setting:
var maxTopCommenters = 8; //jumlah komentar yang mau dimunculkan  
var minComments = 1;       
var numDays = 0;            
var excludeMe = true;       
var excludeUsers = ["Anonymous", "Nama Admin"]; //ganti dengan nama agan
Sekian tutorial Cara menambahkan Widget top komentar blogger dengan avatar semoga bermanfaat...

Share on Facebook
Share on Twitter
Share on Google+
Tags :

Related : Update Widget top komentar blogger dengan avatar

  • Tutorial cara membuat blog lengkap dengan gambarSebelum membuat blog sobat harus terlebih dahulu membuat atau mempunyai email google/gmail, jika belum tahu cara membuat email gmail mampir kesini terlebih dahulu :D. La ...
  • Cara Mengurangi Waktu Respons Server Cara mempercepat loading blog dengan Mengurangi waktu respons server PageSpeed Insights, salam sapa sahabat-sahabat yang baik hati, pada kesempatan yang terbatas ...
  • Cara Membuat Widget Komentar Blogspot Dengan AvatarSalam super,sobat-sobatku yang baik hati kali ini ilkomunived ingin berbagi Cara Membuat Widget Komentar Blogspot Dengan Avatar, seperti LINK SAHABAT yang ada disamping ...
  • CARA MENJALANKAN PHP DI BLOGGERSalam blogger, saya bingung mau kasih judul apa, tapi simak aja ya... Cara menjalankan file php di blog, ditutorial kali ini saya menggunakan script php untuk compress c ...
  • CARA MENAMBAH SYNTAX HIGHLIGHTER DI BLOGGER Cara menuliskan kode php, html. java script, vb, SQL, di blog yaitu menggunakan SyntaxHighlighter, SyntaxHighlighter adalah suatu alat agar kode kita bisa di tulis dal ...

7 komentar:

  1. foto ane nangkring disitu gan :D

    BalasHapus
  2. punya ane juga ada malahan 2 itu (o) ,kapan2 di coba nih tutorialnya

    BalasHapus
    Balasan
    1. Semoga berhasil gan Skripsinya.. ambil jurusan apa?

      Hapus
    2. coba aja gan,,,, :d
      TI gan... @-)

      Hapus
  3. mantap gan :)

    jangan lupa kunjungi website kami di www.168sdb.com
    dan nikmati promo2 yang menarik dari kami
    add pin bb 2a026596
    Terima kasih

    BalasHapus

Berkomentarlah dengan baik dan sopan..
Terimah kasih sudah berkunjung