Cara Membuat Recent Comment Cara Membuat Recent Comment

Wisanto's blogg - Tutorial ini sebenarnya sudah banyak sekali beredar di internet, tapi karena ada salah satu teman blogger yang menanyakan via email cara membuat komentar terbaru dengan avatar, tidak ada salahnya kalau pada malam hari ini saya akan berbagi satu lagi tutorial blog mengenai cara membuat komentar terbaru dengan avatar. Meletakkan widget recent comment akan sangat berguna jika blog yang anda kelola sudah ramai pengunjung, karena terkadang kita sulit untuk mengetahui komentar-komentar yang baru masuk. Kecuali jika pemberitahuan komentar baru atau recent comments diarahkan pada satu email yang sudah kita setting di bagian "Comment Notification Email". Jika sudah diatur, maka dengan sendirinya anda dapat membaca tiap komentar yang masuk hanya dengan membuka email.

Sebenarnya ada alternatif lain untuk mengetahui komentar baru di blog kita, yaitu dengan cara mengecek satu persatu artikel dan melihat komentar yang masuk. Apakah Anda sanggup dan punya banyak waktu untuk melakukan itu? Nah, cara yang ini tentu saja sangat merepotkan karena harus melihat satu-persatu artikel yang ada komentarnya. Untuk itu agar lebih mudah mengetahui komentar terbaru yang masuk ke blog, anda bisa menambahkan widget "Recent Commets" yang sudah disediakan blogger. Selain widget recent comments yang disediakan blogger, anda juga dapat membuat sendiri widget recent comment ini dengan menambahkan fitur avatar agar lebih memperindah tampilan widget tersebut.

Karena prolognya sudah terlalu panjang, sekarang bagaimana cara membuat widget recent commment avatar tanpa harus Edit HTML? Widget ini nantinya seperti gambar diatas, jika anda ingin melihat demonya disini(klik comment pada tab view)

1. Login ke blogger dengan akun Anda.
2. Di dashboard masuk ke layout
3. Setelah itu anda pilih add gadget >> HTML/Javascript
4. Masukkan kode-kode di bawah ini pada kotak HMTL/Javascript
   

   <style type="text/css">
   ul.tb_recent_comments{list-style:none;margin:0;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;}
   </style>
   <script type="text/javascript">
   //<![CDATA[
       // Recent Comments Settings
       var
   numComments  = 5,
   showAvatar  = true,
   avatarSize  = 50,
   characters  = 60,
   defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
   hideCredits = true;
   //]]>
   </script>
   <script type="text/javascript" src="https://masolis-javascript.googlecode.com/svn/trunk/rcentcmmntavr.js"></script>
   <script type="text/javascript" src="http://creatingwebsite-maskolis.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>

   Keterangan :
   Warna merah (5) : adalah jumlah komentar yang ditampilkan
   Warna kuning (50) : ukuran pixel avatar
   Warna hijau (60) : Jumlah karakter huruf komentar
   Warna biru : ganti dengan URL blog Anda.
5. Terakhir save, membuat recent comment dengan avatar telah selesai.