Cara Membuat Recent Comments Dengan Gambar

Trik Blog

i7-core.blogspot.com -Pagi kawan, di pagi yang cerah ini saya mau sharing widget keren nih namanya recent post with rounded corner langsung saja yaaa

Seperti inilah screenshotnya

1. Login ke Blogger
2. Pilih Layout/Tata Letak
3. Pilih add a gadget
4. Pilih HTML/JAVASCRIPT
5. Copy Paste code dibawah ini di HTML

<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="https://googledrive.com/host/0BwkL6_wdJ8zTYW1VVzcxZHRYUUk/"></script>
<script type="text/javascript" src="http://i7-core.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=9999"></script>
</div>

Keterangan : Warna Biru : Bisa disetting sesuai template sobat
                       Warna Merah : Bisa diganti dengan nama blog sobat
Sekian dulu ya jika ada yang ditanyakan silahkan tulis di kolom komentar

Bagikan

Jangan lewatkan

Cara Membuat Recent Comments Dengan Gambar

4/ 5

Oleh Rijal Imnida

Rijal Imnida 07:00 10 Komentar