Cara Membuat Recent Comment Plus Image

Selamat pagi pengunjung Cah dabloeng blog, Sharing pagi kali ini tentang bagaimana membuat Recent Comment Plus Image, yang mana ini sangat membantu bagi pengguna blogger ataupun site-site lainnya. Adapun salah satu kegunaan recent comment ini yaitu mempermudah kalian mengetahui komentar terbaru di blog anda. XD...

Screen Shotnya !!

Oke Sobat blogger langsung aja kita Belajar menerapkan nya di blog, Ikuti langkah-langkah berikut :

1. Masuk Blogger
2. Pilih Rancangan -> Element Laman -> Tambahkan Gadget -> Pilih HTML/JavaScript
3. Masukan Code di bawah ini di dalamnya.

<div style="overflow:auto;width:240px;height:240px;border:1px solid #0F0;padding:8px;margin:10px 0 0">

<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  = 20,
showAvatar  = true,
avatarSize  = 50,
characters  = 60,
defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://johnytemplate.googlecode.com/files/recentcomment.js"></script>
<script type="text/javascript" src="http://ilmu-dedy.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=7"></script></div>

     4. Warna Merah ganti dengan URL Site Sobat !!!
     5. Simpan dan Lihat Hasilnya gan XD....

Semoga bermanfaat dan Bila kurang ngerti bisa komentar di bawah.

Single Links (Recommended)