Membuat widget Recent Comment With Thumbnail

Membuat widget Recent Comment With Thumbnail - Recent Comment kalau diartikan ke dalam bahasa Indonesia yaitu komentar terakhir, naah widget recent comment ini berfungsi agar sobat atau pengunjung blog sobat dapat melihat para readers yang berkomentar di blog sobat. Selain itu, widget ini juga bisa untuk meningkatkan pageview blog sobat. Karena setiap komentar yang telah di publish lalu diklik dan dilihat oleh seseorang. Bisa menambah 1 pageview blog sobat. Hmm, pada waktu sebelumnya juga reggy pernah posting tentang bagaimana cara membuat widget recent comment. Bedanya, yang lalu hanya isi komentar dan namanya.

Kalau yang sekarang ditambah dengan round avatar yang artinya ditambah dengan gambar si comment's writer dengan bentuk lingkaran. Selain itu, script yang digunakan tidak terlalu membuat loading blog menjadi lambat, tampilan yang simpel dan dinamis, anonymous commentator thumbnail dan masih banyak lagi. Untuk penampakannya bisa sobat lihat pada gambar di bawah atau lihat di halaman homepage Blognya Reggy. Nah, untuk membuat widget recent comment with thumbnail bisa sobat copy scriptnya di bawah ini

<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_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;}
.w2b_recent_comments 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;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments 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  = 30,
 roundAvatar = true,
 characters  = 60,
 defaultAvatar  = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivEz06yC-MMcaM5NLmtfaPgrOZv2L0vr-f9pi-CVgtmzTlCTr2VV2UJGxWeytamYWknmqf4lRSSrsYEiDfaEZsp7M0qTxS7uYFxzjFBLNxBcr870_EQkmmJH1NfiR8Z15lL-8nOlaYq_PQ/s1600/gravatar.jpg",
 hideCredits = true;
 maxfeeds=20,
 adminBlog='Reggy Zian Purnama';
//]]>
</script>
<script type="text/javascript" src="http://www.geocities.ws/reggy1998/rcomment.js"></script>
<script type="text/javascript" src="http://blognya-reggy.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=20"></script>

Keterangan:

• numComments = 5 adalah jumlah komentar yang ditampilkan pada widget recent comment with thumbnailnya. Bisa ditambah atau dikurang sesuai keinginan
• characters = 60 adalah jumlah isi komentar yang ditampilkan. Bisa sobat tambahkan atau dikurang sesuai keinginan
• adminBlog='Reggy Zian Purnama' adalah nama admin yang ada di blog sobat. Silahkan ganti dengan nama author/admin yang ada di blog sobat
• Tulisan yang berwarna merah ganti dengan url blog sobat

Semua kode script itu tinggal sobat copy lalu sobat pasang di blog sobat. Lalu atur dari jumlah yang sobat tampilkan, isi komentar, admin blog, url blog dan lain lain, simpan widget lalu lihat hasilnya. Oke sob, sekian dulu untuk membuat widget recent comment with thumbnail. Sampai Jumpa ;)