Salah satu cara untuk melihat komentar terbaru pada blog adalah dengan memasang widget Recent Comments. Biasanya Blog yang memasang Recent comment (widget komentar terbaru) ini adalah blog yang tidak mengaktifkan moderasi komentar. Jadi semisal ada komentar yang baru, maka bisa dilihat langsung pada widget ini.

Misal postingan blog kamu sudah banyak dan blog ramai banyak pengunjungnya maka akan sulit untuk mengetahui komentar baru yang masuk, maka salah satu cara untuk mengetahuinya adalah memasang widget recent comments ini.

Widget Recent Comments With Avatars For Blogger Blog
Widget Recent Comments

Widget Recent Comments Blogger

1. Buat widget baru HTML/JavaScript
2. Simpan kode dibawah ini pada widget diblog anda.
<style>
/*Recent Comments*/
#komentar {border:1px solid #000;margin:5px 0;padding:5px;background: #444;-moz-border-radius-bottomright:10px;-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;}
#komentar ul{margin:0;padding:0px;list-style: none;}
#komentar ul li:first-child {border-top:none;}
#komentar ul li {height:46px; background: #333; list-style-type: none; margin:0 0 5px 0px; padding:5px 5px 5px 5px !important;font-size:12px!important;font-weight:550; border:1px solid #000;-moz-border-radius-bottomright:10px;-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;margin:5px 0;padding:5px;}
#komentar ul li:last-child {border-bottom: none;}
#komentar ul li:hover {background: #444;
-moz-border-radius-bottomright:10px;-moz-border-radius: 5px;
-webkit-border-radius: 5px;
-khtml-border-radius: 5px;
border-radius: 5px;margin:5px 0;padding:5px;}
#komentar a, #komentar a:link, #komentar a:visited {clear:both;color:#fff;display:block;text-decoration:none;}
#komentar .gamen {display: block;float: left;height: 42px;left: 4px;margin-right: 15px;position: relative;width: 42px;}
#komentar .gamen>img { border: 2px solid #000;-webkit-border-radius: 22px;-moz-border-radius: 22px;border-radius: 22px;box-shadow: 0 1px 2px #333;background: url(http://2.bp.blogspot.com/-drq4FvmBMKU/VpckMFf6xSI/AAAAAAAAF9M/9-QLdRGGBAg/s1600/Avatar-Blogger%2BComments-seocips.jpg)repeat-x;}
#komentar ul li div.ismen {color:#fff;}
#komentar .ismen {display: block;font-size: 1.2em;font-style: italic;line-height: 1.2;padding: 2px 4px 2px 0;}
#komentar .gamen>span{width: 150px;height: auto;line-height: 20px;padding: 5px;left: 115px;margin-left: -64px;font-size: 1.2em;font-weight:bold;color: #212121;text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.1);text-align: center;border: 3px solid #5858FA;background: rgba(255,255,255,0.7);text-indent: 0px;border-radius: 5px;position: absolute;pointer-events: none;bottom: 100px;opacity: 0;box-shadow: 1px 1px 2px rgba(0,0,0,0.2);-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
#komentar .gamen>span:before, #komentar .gamen>span:after{content: '';position: absolute;bottom: -15px;left: 50%;margin-left: -9px;width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-top: 10px solid rgba(0,0,0,0.1);}
#komentar .gamen>span:after{bottom: -14px;margin-left: -10px;border-top: 10px solid #5858FA;}
#komentar .gamen:hover>span{opacity: 0.9;bottom: 55px;}
</style>
<div id="komentar">
<ul>
<script type="text/javascript">
//<![CDATA[
var jmlkomentar = 5;
var jmlkarakter = 60; //]]></script>
<script src="https://cdn.rawgit.com/Brando07/share/newbe/recent-comments-seocips.js" type="text/javascript"></script>
<script src="http://www.seocips.com/feeds/comments/default?alt=json&amp;callback=tampilkankomentar" type="text/javascript"></script>
</ul>
</div>
<div style="font-size: 60%; text-align: right;">
<small><a href="http://www.seocips.com/2014/04/widget-recent-comments-for-blogger.html" target="_blank" title="widget recent comment">Get This Widget</a></small></div>
3. Perhatikan kode diatas, kode yang berwarna diatas, silahkan disesuaikan dengan selera Anda :
  • var jmlkomentar = 5, (jumlah komentar yang ditampilkan)
  • var jmlkarakter = 60;, (jumlah karakter yang ditampilkan)
  • Ganti http://www.seocips.com dengan url blog Anda,
5. Simpan dan lihat hasilnya.



Oh ya, walaupun kamu sudah memasang widget ini sebaiknya kamu rajin memantau akan komentar yang masuk, jangan sampai komentar Spam dibiarkan saja.

Selanjut masih berhubungan dengan komentar blog coba lihat:
Ok sekian widget yang dapat dibagikan oleh seocips.com saat ini, Salam sukses.
2 Komentar untuk "Widget Recent Comments With Avatars For Blogger Blog"