Cara Membuat Widget Recent Comment Menarik Dengan Avatar

Selamat siang sobat blogger. apa kabar sobat siang ini? semoga selalu dalam keadaan sehat, amin. ok, kali ini saya akan mencoba berbagi pada sobat sekalian mengenai Cara Membuat Widget Recent Comment Menarik Dengan Avatar .

Apa itu recent comment? recent comment adalah sebuah widget yang memberitahukan komentar terbaru atau bisa juga untuk mempercantik tampilan di blog dengan selalu memperbarui apabila ada komentator yang masuk ke blog kita maka secara otomatis, komentar tersebut akan muncul di bagian atas widget. jadi lumayan bagus widget ini di pasang di sidebar atau di bagian foofter kalau menurut saya. Cara Membuat Widget Recent Comment Menarik Dengan Avatar

Ok, langsung saja saya akan bagikan cara installnya. yang Pertama tentu sobat log in dulu ke akun blogger sobat kemudian langsung menuju tata letak => Add Gadget, lalu pilih menu HTML Javascript, selanjutnya masukan script 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="https://lavixtastar-code.googlecode.com/files/Recent_Comments_SEO_lavixtastar.js"></script>
<script type="text/javascript" src="http://belajarseoawal.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=9999"></script>
</div>


- Ganti tulisan yang berwarna biru dengan url blog sobat. kemudian Klik Simpan.

Mudah bukan? lalu lihat hasilnya, apabila sobat pengen tau tampilan widget ini dulu, silahkan lihat sidebar blog saya. itu adalah widget yang sama seperti yang saya bagikan ini.

Saya kira hanya itu yang dapat saya bagikan untuk kali ini dan apabila ada pertanyaan silahkan berkomentar di bawah dan ingat!! jangan sertakan link ke komentar karena apabila terdapat link aktif maupun tidak aktif akan langsung saya hapus. Cara Membuat Widget Recent Comment Menarik Dengan Avatar