Membuat Recent Comment Dengan Gambar

Bisakah anda membuat recent comment (komentar terbaru dengan thumbnail atau gambar? Jika anda tidak bisa, mari anda ikuti artikel yang berkenaan dengan tutorial blog ini. Bahkan, menurut Kang Fathur sebaiknya anda memasang widget ini agar anda tahu siapa yang berkomentar dalam blog kesayangan anda.

Anda bisa melihat gambar ini untuk memastikan anda tidak menyesal dalam penerapannya. Atau langsung anda lihat di tab menu "Comment" pada blog Kang Fathur ini.

Bagaimana? Tertarik? Jika jawabannya iya, ikuti langkanya sebagai berikut :

Langkah Pertama

• Anda langsung Login Blogger;
• Pilih Design atau Rancangan;
• Klik tab Edit HTML;
• Cari Kode ]]></b:skin>
• Copy paste kode berikut sebelum kode ]]></b:skin>

ul.tb_recent_comments{list-style:none;margin-top:15px;padding:0;}
.tb_recent_comments li{background:none !important;margin:0 0 6px !important;padding:0 0 6px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
.tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.tb_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}

• Cari Kode </head>
• Copy Paste kode dibawah ini sebelum kode </head>

<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
numComments  = 7,
showAvatar  = true,
avatarSize  = 30,
characters  = 60,
defaultAvatar  = "http://1.bp.blogspot.com/-LCtABolbUDQ/T4c5vHX7AuI/AAAAAAAAAGw/bAKjTt-BsVI/s1600/avatar.png",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://zona-fathur.googlecode.com/files/cammentavatar.js"></script>

• Simpan Template

Langkah Kedua

• Tetap pada tab Design (Rancangan);
• Klik tab Elemen Laman (Tambahkan Widget);
• Pilih HTML/JavaScript;
• Copy paste kode berikut kedalam HTML yang baru dipilih;

<script type="text/javascript" src="http://kang-fathur.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=7"></script>

• Simpan.

Catatan : Ganti dengan http://kang-fathur.blogspot.com URL blog anda.

Bagaimana gampang bukan? silakan dicoba dan semoga berhasil dan bermanfaat bagi anda semua. Salam blogger Indonesia.

Source : Kang Fathur