Widget Blogger dengan Circle Thumbnail untuk Recent Comments

Dilihat :  kali
Selain widget Top Comments atau Most Commented, Anda juga membutuhkan widget Recent Comments jika cukup banyak yang memberikan komentar terhadap posting Anda. Ini penting untuk mengetahui komentar terkini terhadap posting Anda. Untuk memunculkan Recent Comments dengan Circle Thumbnail, silakan lakukan langkah-langkah berikut ini:

1. Masuk ke akun Blogger Anda. Pilih Blog Anda dan klik pada Layout/Tata Letak > Add Gadget/Tambah Gadget.




2. Lalu klik pada HTML/JavaScript.



3. Setelah itu copy paste kode HTML/JavaScript berikut:

 <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 15px !important;padding:0 15px 0 !important;display:block;clear:both;overflow:hidden;list-style:none;}
    .w2b_recent_comments li .avatarImage{padding:1px;background:#00ffff;-webkit-box-shadow:0 1px 1px #000;-moz-box-shadow:0 1px 1px #000;box-shadow:0 1px 1px #000;float:left;margin:0 5px 0 0;position:relative;overflow:hidden;}
    .avatarRound{-webkit-border-radius:70px;-moz-border-radius:70px;border-radius:70px;}
    .w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .w2b_recent_comments li span{margin-top:4px;color: #fff;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  = 50,
       roundAvatar = true,
       characters  = 50,
       showMorelink = false,
       moreLinktext = "More &#187;",
       defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
       hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="https://sites.google.com/site/seocips/seocips-script/rcwa.js"></script>
<script type="text/javascript" src="http://your-blog.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>


Keterangan:
Ganti your-blog.blogspot.com dengan alamat blog Anda.
Variabel warna orange dapat diganti sesuai keinginan Anda.
 


EmoticonEmoticon