Dengan memasang widget ini berarti kita mengapresiasi kepada mereka yang telah berlalu lalang di blog kita dan meninggalkan jejaknya. Sebenarnya script widget ini masih sama dengan script top komentator, tapi widget ini di buat dengan tampilan yang berbeda.
FITUR
- Menampilkan avatar dan nama.
- Desain yang elegan.
- Enak dipandang.
- Memiliki efek hover pada avatar.
1. Login ke akun blogger anda.
2. Klik Laman.
3. Pilih mode HTML.
4. Masukkan kode berikut.
<style type="text/css">NOTE : http://www.yhsblogger.blogspot.com ganti dengan url blog anda.
.cm-person{margin:3px;position:relative;float:left;width:80px;height:100px;font:10px/10px Lora,Verdana,Arial,Sans-Serif;text-align:center;line-height:10px;padding:10px; border: 1px solid #F6CEE3; 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:80px;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:80px;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://www.yhsblogger.blogspot.com',
maxTopCommenters = 77,
minComments = 1,
numDays = 0,
excludeMe = true,
excludeUsers = ["Anonymous", "Yuslim Hanif"],
maxUserNameLength = 42,
txtTopLine = '[image] [user]',
txtNoTopCommenters = 'No top commentators at this time.',
txtAnonymous = '',
sizeAvatar = 80,
cropAvatar = true,
urlNoAvatar = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhouDKD1vo0HAauaE3hBtGZelseqH0t3rESNQUaudjk88BOpF9akYMCzR7QxwiBFrm5JdMH_qdivONsUdzchzl-ezz4CO5gMFS64djAMUdaVfRz0xaX-buW3tLDtQ9mEUEHs_5ScFxy3TI/' + 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>
Yuslim Hanif ganti dengan nama anda jika anda tidak ingin masuk daftar ini.
5. Klik Publikasikan.
Demikianlah artikel YHS Blogger semoga bermanfaat. Dan selamat mencoba sob...

Tidak ada komentar:
Posting Komentar