Cara Pasang Recent Comments Dengan Avatar Untuk Blogger V.3

Cara Pasang Recent Comments Dengan Avatar Untuk Blogger V.3
Cara Pasang Recent Comments Dengan Avatar Untuk Blogger V.3 ,sobat blogger Recent comment atau widget komentar terbaru ini diberinama Recent Comments v.3.
Script original masih buatan Harish Dasari dan diedit oleh Afandi Kusuma. Pada versi sebelumnya, script yang digunakan yaitu dari Kang Asep Sakahayang.


Yang berbeda pada v.3 ini yaitu clickable area (area yang bisa diklik) bukan hanya pada Nama Komentator, tetapi disekitar avatar, nama, dan isi komentar semuanya clickable. Kelebihan lain v.3 ini yaitu valid HTML5.

Cara pemasangannya sangat mudah, yaitu buat widget baru HTML/JavaScript dan simpan kode ini didalamnya.


<style type="text/css" scoped> 
ul.kangismet_recent{list-style:none;margin:0;padding:0;} 
.kangismet_recent li{background:none !important;margin:0 0 6px !important;padding:3px  
!important;display:block;clear:both;overflow:hidden;list-style:none; border: 1px solid transparent;
border-radius:9px; max-height: 100px;} 
.kangismet_recent li:hover{border: 1px solid #ddd;}
.kangismet_recent a {text-decoration:none;}
.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;width:35px;height:35px} 
.kangismet_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;} 
</style>
<script type="text/javascript">
//<![CDATA[
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 35,
 roundAvatar = true,
 characters  = 40,
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = true;
 maxfeeds=50,
 adminBlog='Markus Kono';
//]]>
</script>
<script type="text/javascript" src="http://yourjavascript.com/12021133931/recentcommentsanaktimor17blog.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=kangismet_recent&amp;&amp;max-results=50">
</script>


 Untuk membuat tampilan berbeda, silahkan edit CSS diatas. Penjelasan script yang bisa dikostumisasi :

numComments = 5 (jumlah komentar yang ditampilkan)
showAvatar = true (false, apabila ingin menyembunyikan avatar)
avatarSize = 35 (ukuran avatar dalam pixel)
roundAvatar = true (avatar bulat)
characters = 40 (jumlah karakter isi komentar)
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm" (avatar default)
adminBlog='Markus Kono' (nama admin blog, wajib diganti)


Catatan Update :
v.3 - 15.09.2013

  • Script modified by Afandi Kusuma
  • Expanded clickable area
  • Fixed HTML5 validation issues by Kang Ismet


Selamat mencoba !! Happy Blogging !!

sumber
3 comments
  1. Adhy Suryadi
    Jadi lebih mudah kliknya ya mas... :D
    • Putra Kefa
      iya betul Kang :) salam blogger !!
  2. Agung Kharisma
    Saya sudah memasang widget ini di blog. Sangat membantu sekali untuk monitoring siapa saja yang berkomentar di blog. Jadi, dengan widget ini saya bisa lebih cepat membalas komentar dari pembaca blog.

    Oh ya, blognya sudah saya follow min. Ditunggu ya komentar dan follbacknya diblog saya. :)
    http://dailybloggerpro.blogspot.com/
    http://rumahcerpenmu.blogspot.com/
    Salam blogger :)