Saturday, May 11, 2013

Membuat Widget Recent Commen

Pada Sore ini saya akan share bagaimana cara Membuat Widget Recent Commen Dengan Avatar :)
contoh nya lihat gambar berikut ini


1.anda login dahulu ke blog anda
2. Pada dasbor >> Pilih Tata Letak >> Add Gadget >> HTML/JavaScript
3copy code di bawah ini
<div style="overflow:auto;width:300px;">
<style type="text/css">
ul.w2b_recent_comments{list-style:none;margin:0;padding:0;}
.w2b_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;}
.w2b_recent_comments li .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;}
.w2b_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.w2b_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 12px;font-style: none;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 40, roundAvatar = true,
characters = 100,
defaultAvatar = "",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://berbagitips46.blogspot.com.googlecode.com/files/RecentComment-W-Gravatar.js"></script>
<script type="text/javascript" src="http://berbagitips46.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>
<small><div style="font-size:90%; text-align:right; text-shadow:2px 2px 2px #adadad;"><a href="http://berbagitips46.blogspot.com" target="_blank" title="Widget Recent Comment">Get This Widget</a></div></small></div>


Sebelum anda save perhatikan kode diatas yang berwarna biru
width:300px; (sesuaikan dengan lebar, supaya mudah ubah saja jadi 100%)
numComments (jumlah komentar yang ingin ditampilkan)
avatarSize (ukuran avatar atau gambar profil)
characters (jumlah kata pada komentar yang ingin ditampilkan)
URL feed comment blog ini ganti dengan blog anda!

4.kemudian Save

Dan Semoga Ini Bisa Bermanfaat Bagi Anda :)

0 comments:

Post a Comment

live