Cara Gampang Membuat Recent Comment Dengan Avatar

Cara Gampang Membuat Recent Comment Dengan Avatar | Hay sobat apa kabar kalian semua ? Kali iniRevian-4rt akan berbagi tutorial seputar blog. Tutorial kali ini adalah Membuat Recent Comment With Avatar. Tutorial kali ini sumber inspirasinya datang dari blog W2B.

DEMO

Widget recent koment ini manfaatnya kita bisa melihat komentar terakhir di blog kita tanpa harus membuka / login ke blogger dulu dan pengunjung blog kita juga bisa melihat komentar terakhir yang ada di blog kita. Selain itu juga, blog kita juga akan terlihat lebih cantik dengan widget ini. Penasaran ingin memasangnya ke blog anda ? Silahkan ikuti tutorial dibawah ini dengan benar.

Tutorial Membuat Recent Comment Dengan Avatar :

1. Buka blogger.
2. Masuk ke menu Tata Letak.
3. Setelah itu anda pilih Add Gadget.
4. Lalu pilih HTML/JavaScript.
5. Lalu Copy Paste kode dibawah ini dan masukkan ke HTML/JavaScript.

<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: italic;
line-height: 1.4;
}
</style>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 30,
roundAvatar = true,
characters = 40,
showMorelink = false,
moreLinktext = "More »",
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/w2b recent comments with avatars.js"></script>
<script type="text/javascript" src="http://revian-4rt.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

6. Lalu save.

Setting :

Ganti revian-4rt dengan url blog anda.
Ganti angka 5 dengan jumlah komentar yang akan dimunculkan.
Ganti http://www.gravatar.com/avatar/?d=mm dengan gambar default avatar / anonymous yang akan tampil.Oke cukup gampang bukan tutorial diatas ? Sekian postingan kali ini dari saya yang berjudul Cara Gampang Membuat Recent Comment Dengan Avatar, bila ada kekurangan mohon dimaafkan dan apabila ada kelebihannya semoga bisa bermanfaat untuk kita semua. Bila tutorial diatas tidak work, silahkan beritahu kami lewat kolom komentar dibawah ini. Sekian dan terimakasih ^_^