Memasang Recent Comments dengan Avatar di Blogger

recent comments widget gadget

Memasang recent comment atau komentar terakhir dengan avatar tentunya akan membuat tampilan blog Anda akan terlihat lebih menarik karena avatar dari komentator dapat terlihat. Tentunya bagi komentator yang memasang avatar pada profil mereka. Sedangkan yang tidak memasang avatar pada profile mereka akan terlihat seperti avatar default yang terlihat pada gambar di samping. Untuk itu segeralah memasangnya agar komentar terakhir yang muncul pada blog kita akan terlihat lebih menarik. :)





Cara Memasang:

1. Blogger Dashboard pilih blog --> Layout --> Add gadget
add gadget

 

2.  Pop-up window scroll ke bawah pilih HTML/Javascript
html/javascript
 
3. Copy dan Paste kode berikut pada kolom gadget

 <style type="text/css">
ul.dewainsidecomments{list-style: none;margin: 0;padding: 0;}
.dewainsidecomments li {background: none !important;margin: 0 0 6px !important;padding: 0 0 6px 0 !important;display: block;clear: both;overflow: hidden;list-style: none;word-break:break-all;}
.dewainsidecomments li .avatarImage {padding: 3px;
background: #fefefe;-webkit-box-shadow: 0 1px 1px #ccc;-moz-box-shadow: 0 1px 1px #ccc;box-shadow: 0 1px 1px #ccc;float: left;margin: 0 6px 0 0;position: relative;overflow: hidden;}
.avatarRound {-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;}
.dewainsidecomments li img {padding: 0px;position: relative;overflow: hidden;display: block;}
.dewainsidecomments li span {margin-top: 4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 40,
 roundAvatar = true,
 characters  = 40,
 showMorelink = false,
 moreLinktext = "More »",
 defaultAvatar  = "http://4.bp.blogspot.com/-SRSVCXNxbAc/UrbxxXd06YI/AAAAAAAAFl4/332qncR9pD4/s1600/default-avatar.jpg",
 hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://dewainside.googlecode.com/svn/trunk/[dewainside.blogspot.com]recent_comment.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=dewainsidecomments&max-results=5"></script>
Catatan:
Mengganti bentuk avatar menjadi kotak hapus kode kuning
Mengganti gambar avatar default kode orange
Mengganti jumlah komentar: ganti angka 5 
Mengganti ukuran avatar:  avatarSize  = 40 

4. Save

Selamat mencoba
Good luck.
 

0 comments:

Posting Komentar

Setiap komentar sangat dihargai, namun karena keterbatasan waktu tidak dapat online setiap saat untuk me-reply komentar setiap orang. Komentar Spam (link aktif, o*at, p*rn*, j*di, dan sejenisnya) akan dimoderasi. Terima kasih atas perhatiannya dan Berkunjung kembali :)