Moch Adnan 23 Mei 2014

Cara Membuat Widget Recent Comment

Cara Membuat Widget Recent Comment
Untuk menampilkan beberapa komentar terbaru ke dalam sidebar blogger, maka sebelumnya anda harus membuat sebuah widget yang berfungsi untuk menampilkan komentar-komentar tersebut. Nah, dalam kesempatan kali ini saya akan coba menyuguhkan sebuah tutorial cara membuat widget/gadget recent comment lengkap dengan avatar si pengomentar. Yang mana dengan gadget recent comment with avatar ini, saya yakin tampilan komentar terakhir dalam blogspot anda akan terlihat semakin menarik. Baca juga Cara membuat widget komentar terakhir menggunakan comment slider

Baik langsung saja sekarang Anda 'Login' kedalam dasbor Blog, setelah itu pilih 'Tata Letak' kemudian pilih 'Add a gadget' atau tambahkan gadget baru. Pilih 'HTML' kemudian copy dan pastekan kode script di bawah ini kedalam gadget HTML tadi..

<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 src="https://googledrive.com/host/0B9D8rrkPwqxPWXNWSXV5RENQOWc" type="text/javascript"></script>

<script type="text/javascript" src="http://NAMABLOGANDA.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=9999"></script>

</div> 

 Perlu diperhatikan bahwa dalam kode di atas ada beberapa kode yang harus anda edit (ganti) terlebih dahulu agar gadget/widget recent comment ini berjalan sesuai dengan yang anda harapkan. Dimana atau pada bagian apa sajakah anda perlu mengedit? Cukup Edit pada bagian kode yang masing-masingnya berwarna Merah. itu saja. Pilih 'Simpan' Gadget dan selesai.

Demikian saja cara membuat widget / Gadget Recent Comment untuk blogspot, jika ada pertanyaan silahkan tinggalkan di kolom komentar, secepatnya saya akan merespon setiap pertanyaan anda. baca juga tutorial saya sebelumnya tentang cara membuat widget/ gadget Recent Posts/ Artikel Terbaru