Membuat Recent Comments Terbaru!

Hallo sobat, kali ini Coffee Break bakal ngasih tips gimana cara membuat widget blog Recent Comment / Komentar terbaru seperti yang digambar .

nah, lu cuma butuh meluangkan waktu beberapa menit saja agar blog lu terlihat lebih elegan dan tetap ringan pastinya, lalu tips kali ini cukup mudah, karna lu cuma hanya memainkan html/javascript di layout blog lu aja. .



langsung aja ke tipsnya  ..

Keterangan:
numComments - Berfungsi untuk menampilkan jumlah komentar.
showAvatar - ganti ke false jika lu ingin menyembunyikan avatar di widget.
avatarSize - Size avatar dalam pixels.
roundAvatar - Ganti ke false jika lu ga mau avatar berbentuk bulat
characters - Jumlah karakter yang dilihatkan di widget.
defaultAvatar - ini digunakan buat komentator yang tidak memiliki avatar.
adminBlog - ganti dengan nama lu 

copy Kode/Code html yang lu perlukan dibawah ini :

<style type="text/css" scoped>
ul.allbloggertricks_recent{list-style:none;margin:0;padding:0;}
.allbloggertricks_recent li{background:none!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;border-radius:9px;max-height:100px;-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:0;-moz-transition-property:0;-o-transition-property:0;transition-property:transform;margin:0 0 6px!important;padding:3px!important}
.allbloggertricks_recent li:hover{border:1px solid #ddd;
-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-o-transform:rotate(6deg) }
.allbloggertricks_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}
.allbloggertricks_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='Your Name';
//]]>
</script>
<script type="text/javascript" src="http://files.allbloggertricks.com/Scripts/abt-recent-commentsv3.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=allbloggertricks_recent&amp;&amp;max-results=50">
</script>

Buat caranya seperti biasa lu menambahkan widget di blog lu, yaitu :

• Masuk ke Blogger . 
• Pilih Layout/ Tata letak
• Tambahkan html/javascript 
• lalu copy code yang udah disediakan diatas

Tara, Widget selesai dipasang. lu akan milahat hasilnya jika pengunjung meninggalkan komentarnya di blog milik lu ., 

Trima kasih, jangan lupa tinggalkan komentar  :) 

SHARE THIS