Cara Memasang Widget Recent Comment Dengan Avatar

Tips Blogger. Cara Pasang Widget Recent Comments Dengan Avatar. Dengan memasang widget ini, anda dapat mempercantik blog anda terutada pada kolom comment di blog anda.

Sebenarnya widget untuk resent comment ini sudah banyak versi ketika anda mencarinya melalui mesin pencari atau browsing,, namun yang akan saya bahas kali ini adalah tentang Cara Memasang Widget Recent Comment dengan Avatar. Jika anda tertarik untuk memasang widget ini i blog anda, anda bisa dengan mudah melakukannya, karena di artikel yang saya share kali ini, saya juga telah menyediakan langkah-langkahnya hanya cukup menambahkan kode CSS'nya untuk anda. Yuk langsung saja pratek dengan mengikuti beberapa langkah berikut.

Cara Memasang Widget Recent Comment Dengan Avatar

=> Masuk ke Dasbor Blog anda
=> Pilih Tata Letak >> Tambah Gadget >> HTML/JavaScript
=> Copy'kan kode dibawah ini pada kolom HTML/JavaScript

Klik Spoiler Berikut:

<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://tipstrikblogging.googlecode.com/files/RecentComment-W-Gravatar.js"></script>
<script type="text/javascript" src="http://www.tipstrikblogging.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://4rie-ngr.blogspot.com/2015/04/memasang-widget-recent-comment-dengan-Avatar.html" target="_blank" title="Widget Recent Comment">Get This Widget</a></div></small></div>

Ket :
Text berwarna Merah adalah lebar widget, bisa anda sesuaikan dengan template blog anda
Text berwarna Hijau adalah Jumlah komentar yang bisa anda rubah sendiri
Text berwarna Kuning adalah ukuran avatar
Text berwarna Ungu adalah jumlah kata yang akan ditampilkan pada kolom komentar
Text berwarna Biru merupakan link Blog, yang harus anda ganti dengan link blog anda

=> Save  dan lihat hasilnya..
=> SELESAI

Semoga dengan apa yang saya share tentang Cara Memasang Widget Recent Comment Dengan Avatar ini, bisa bermanfaat untuk anda. Selamat Mencoba.!!

Share :