Pada entri ini, saya akan berkongsi satu widget recent comment yang simple je seperti screenshot diatas. Macam mana, menarik bukan. Nak letak pada blog anda? ikut tutorial dibawah k.
Tutorial:
1. Login ke Dashboard blogger.
2. Klik butang " More Options (rujuk no 1 pada GAMBAR 1) " dan klik " Layout (rujuk no 2 pada GAMBAR 1) ".
 |
GAMBAR 1 |
3. Pada halaman Layout, klik " Add a Gadget (rujuk no 3 pada GAMBAR 2) " pada mana-mana bahagian yang anda nak untuk letakkan kod javascript tu nanti.
 |
GAMBAR 2 |
4. Cari HTML/Javascript dan klik butang tambah (rujuk no 4 pada GAMBAR 3).
 |
GAMBAR 3 |
5. Copy (CTRL+C) kod javascript dibawah:
<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 = "https://sites.google.com/site/faiztutorial/home/imej/none-img.png",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="https://sites.google.com/site/faiztutorial/home/javascript/recentcomment1.js"></script>
<script type="text/javascript" src="http://faiz-tutorial.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>
## Gantikan:
- http://faiz-tutorial.blogspot.com - Tukarkan kepada URL blog anda.
- numComments = 5 - Jumlah komen yang akan dipaparkan
6. Paste (CTRL+V) pada ruang Content (rujuk no 5 pada GAMBAR 4)
 |
GAMBAR 4 |
7. Seterusnya klik " Save (rujuk no 6 pada GAMBAR 4 ) " dan lihat la hasilnya..