Cara Membuat Top Komentar di Blog

Cara Membuat Top Komentar di Blog

sds

5/09/2013

1 Komentar

Cara Membuat Top Komentar di Blog - Alhamdulillah kali ini saya masih sempat update postingan yang dimana sebelumnya saya telah membahas tentang Cara Mengganti Background Blog dengan Gambar. Dan kali  ini saya akan mencoba membahas tentang Cara Membuat Top Komentar di Blog.

Pasti anda bertanya-tanya apa sih sebenarnya yang di maksud Top Komentar ?. Jadi Top Komentar adalah Fitur atau cara untuk mengetahui siapa yang sering berkomentar di blog kita. Top Komentar ini juga bisa membuat orang berlomba-lomba untuk berkomentar di blog kita. Nah untuk lebih jelasnya lihat contohnya di bawah ini

Dengan melihat gambar diatas, kita dapat menarik kesimpulan bahwa "Brebes VS Lamongan" lah yang sering berkomentar di blog kita dengan jumlah komentar 48. Keren kan ? Jika tertarik dengan Top Komentar ini, ikutilah langkah-langkah untuk membuatnya.

Berikut ini Cara Membuat Top Komentar di Blog :

1. Anda harus login dulu di blogger.com

2. Pilih Layout --> Tambahkan Gadget di sidebar

3. Pilih HTML/Java Script

4. Copy kode di bawah ini ke dalam gadget HTML/Java Script tadi

<div dir="ltr" style="text-align: left;" trbidi="on"><div dir="ltr" style="text-align: left;" trbidi="on"><br /></div><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 MS-potilas 2012.// Gets a list of top commentators from all comments, or specified number of days in the past.// See http://yabtb.blogspot.com/2012/05/top-commenters-gadget-with-avatars.html//// CONFIG:var maxTopCommenters = 30; // 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 = ["Raja Artikel", "Anonymous", "Muhammad Hidayatullah"]; // 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/AVvXsEjAg8vN3avnygIkNmMJmGjMu4HnUoWsOnDUVBCr_2z0vbHJr4uKnPHTJPe3s5etHS44kcZSbkr_upW9RzDOvzUTzgv0nZ66wLprs5zxE-cAWuXjXc0NCB4I8zg3ro_hdMNBhl2GF0biBIY/"+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 8601var 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 daysvar 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 tuplesvar 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>

5. Ubah kode warna Merah dengan jumlah komentar yang ingin di tampilkan.
6. Ubah kode warna Biru dengan nama orang yang tidak ingin ditampilkan di Top Komentar seperti Admin, Anonim, dan lain-lain.
7. Setelah itu lihatlah hasilnya.

Demikian postingan saya ini tentang Cara Membuat Top Komentar di Blog semoga dapat bermanfaat. Dan jika terjadi masalah tentang postingan ini, anda bisa menanyakan melalui berkomentar di bawah ini.

Sudah tahu kan Cara Membuat Top Komentar di Blog ?