Cara Membuat Recent Comment Dengan Avatar

Widget Recent Comment dengan Avatar -- Atau sering juga disebut dengan komentar terbaru dengan icon atau gambar profil komentator memang terkadang ada juga kegunaannya, contohnya saat kita membuka blog kita tentunya kita dapat melihat komentar terbaru yang ada tanpa membuka blogger/home.Mungkin sobat menginginkan widget Recent Comment yang seperti ini :

Untuk Membuat Komentar Terbaru Dengan Icon Avatar, ikuti langkah berikut :

• Masuk ke Blogger 
• Masuk ke Edit Tata Letak ( Layout ) 
• Tambahkan widget HTML/JavaScript
• Copy Paste Kode Berikut :

<div style=" overflow:auto; text-align: left; width: 300px;">
<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 = 6,
showAvatar = true,
avatarSize = 30,
roundAvatar = true,
characters = 40,
showMorelink = false,
moreLinktext = "More »",
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = false;
//]]></script>
<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b-recent-comments-w-gravatar.js"></script>
<script type="text/javascript" src="http://www.warehouse1994.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=6"></script>
</div>

NB :

• Perhatikan kode warna Merah !

1. 6 adalah jumlah komentar yang tampil
2. 30 adalah besar image avatar
3. 40 adalah jumlah maksimal karakter
4. Warehouse1994.blogspot.com ganti dengan URL alamat Blog sobat.

•  Sobat bisa ganti sendiri sesuai dengan selera.
• Simpan dan lihat hasilnya.