Membuat Member Komentator Aktif

Sahabat blogger pemula yang baik hatinya, membuat member komentator aktif pada blog adalah sebuah upaya untuk memberikan apresiasi terhadap pengunjung khususnya sahabat-sahabat kita yang telah memberikan kontribusi komentar pada artikel yang kita publish.

Tentunya dengan adanya widget komentator aktif ini akan memberikan kesempatan kepada para komentator untuk mendapatkan backlink gratis dari blog kita

Setiap komentator dengan komentar terbanyak akan mendapatkan posisi teratas/terdepan di blog kita, dengan demikian mereka akan semakin bersemangat untuk berkomentar lagi diblog kita, yang tentunya akan berdampak baik untuk blog yang kita kelola, blog kita akan semakin ramai pengunjung dan secara tidak langsung akan merampingkan alexa rank yang selama ini kita idam-idamkan..

Bagaimana, apakah sobat tertarik untuk memasangnya? sebenarnya caranya sangatlah mudah sobat tinggal melakukan 2 langkah berikut ini :

• Pertama. Silahkan sobat membuat halaman setatis atau membuat postingan baru dengan model HTML (bukan Compase)
• Masukkan kode dibawah ini pada area postingan lalu publikasikan

<style type="text/css">
.cm-person{margin:3px;position:relative;float:left;width:120px;height:120px;font:10px/10px Lora,Verdana,Arial,Sans-Serif;text-align:center;line-height:10px;padding:10px; border: 1px solid #008B8B; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;color:#000;background-color:#fff;box-shadow:inset 0 0 1px black}
.cm-person a.profile-name-link{display:block;width:100px;height:80px;position:absolute;top:10px;left:10px;background-color:#999;color:white;text-decoration:none;font:bold 30px/80px Ubuntu,Tahoma,Verdana,Arial,Sans-Serif;margin:0 0;padding:0 0;display:none}
.cm-person a.profile-name-link.item1{background-color:#BC0000}
.cm-person a.profile-name-link.item2{background-color:#1A00CE}
.cm-person a.profile-name-link.item3{background-color:#39A003}
.cm-person a.profile-name-link.item4{background-color:#8B039D}
.cm-person a.profile-name-link.item5{background-color:#F0C100}
.cm-person a.profile-name-link.item6{background-color:#00D1CB}
.cm-person a.profile-name-link.item7{background-color:#FFEA03}
.post .post-body .cm-person img{background-color:#666;display:block;width:100px;height:80px;padding:0 0;margin:0 0 10px;border:none}
.cm-person:hover{color: #FFF;background-color:#111}
.cm-person:hover a.profile-name-link{display:block}
.comments {display: none;}
</style>
<script type="text/javascript">
//<![CDATA[
var homepage = 'http://adjieumbara.blogspot.com/',
  maxTopCommenters = 77,
  minComments = 1,
  numDays = 0,
  excludeMe = true,
  excludeUsers = ["Anonymous", "Adjie Umbara"],
  maxUserNameLength = 42,
  txtTopLine = '[image] [user]',
  txtNoTopCommenters = 'No top commentators at this time.',
  txtAnonymous = '',
  sizeAvatar = 120,
  cropAvatar = true,
  urlNoAvatar = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg0uz8S9XJrtorStsc6NmNXCbRlvXcDBejvZyat-weI31q-QCBJrkAcLVt0vLZdXxyW0a0RswP0mh8Lhj9M0mPT09gONdS1LYaQkJztGOgV2kyePAqQAuQOJoKh1LEjfJ6Th4iwt1KNFrA/' + sizeAvatar + '/avatar_blue_m_96.png',
  urlAnoAvatar = 'http://www.gravatar.com/avatar/00000000000000000000000000000000?d=mm&s=' + sizeAvatar,
  urlMyProfile = '',
  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 = '<div class="cm-person"><img class="top-commenter-avatar" height="' + sizeAvatar + '" width="' + sizeAvatar + '" 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 item' + position + '" href="' + authorUri + '" title="' + position + '. ' + authorName + '">' + item.count + '</a>' + authorName.substring(0, 14) + '</div>
';
  text = text.replace('[user]', authorcode);
  text = text.replace('[image]', imgcode);
  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);
      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.feed.entry.length > 200) {
    ndxbase += 200;
    document.write('<script type="text/javascript" src="' + homepage + '/feeds/comments/default?redirect=false&max-results=200&start-index=' + ndxbase + '&alt=json-in-script&callback=showTopCommenters"></' + 'script>');
    return
  }
  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(replaceTopCmtVars(txtTopLine, item, realcount + 1));
    realcount++
  }
  if (!realcount) document.write(txtNoTopCommenters)
}
document.write('<script type="text/javascript" src="' + homepage + '/feeds/comments/default?redirect=false&max-results=200&alt=json-in-script&callback=showTopCommenters"></' + 'script>');
//]]>
</script>  

Nah biar tidak penasaran seperti apa hasilnya silahkan sobat klik Live Demo dibawah ini

Live Demo

Nah sekarang sobat tinggal mengganti teks yang berwarna merah dengan URL blog yang sobat miliki, kode diatas saya dapatkan dari blog www.tipstrikblogging.com dengan sedikit perubahan yang diperlukan.

Dengan adanya widget member komentator aktif pada blog mudah-mudahan blog kita akan semakin menarik minat pengunjung untuk terus berkomentar diblog kita..
Jangan lupa untuk segera Mengganti URL khusus profile google+ sobat sebelum diambil atau diklaim sama orang lain.
Salam persahabatan..

Sumber gambar : www.multipaste.web.id