Home » » Cara Membuat Recent Comment dengan Avatar Image Unik

Cara Membuat Recent Comment dengan Avatar Image Unik

Posted by Kumpulan Artikel on Monday, June 4, 2012


Buat sobat blogger yang ingin menampilkan komentar terakhir di blognya bisa mencoba widget yang satu ini. menurut saya widget recent comments ini cukup unik karena juga menampilkan avatar image. Sobat blogger bisa melihat tampilannya seperti pada gambar di bawah. 
recent comments with avatar image

 Caranya....? Masuk ke akun blogger > tata letak > add gadget> HTML/Javascript
Setelah itu tinggal masukkan saja kode widget recent comments dibawah ini;
<style type="text/css">    ul.md_recent_comments{list-style:none;margin:0;padding:0;}    .md_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;}    .md_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;}    .md_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}    .md_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 13px;font-style: italic;line-height: 1.4;}</style><script type="text/javascript">//<![CDATA[    // Recent Comments Settings    var    numComments     = 5,    showAvatar     = true,    avatarSize     = 60,    roundAvatar    = true,    characters     = 40,    showMorelink    = true,    moreLinktext    = "More »",    defaultAvatar     = "http://www.gravatar.com/avatar/?d=mm",    hideCredits    = false;//]]></script><script type="text/javascript" src="http://julak-project.googlecode.com/files/recent%20comments%20.js"></script><script type="text/javascript" src="http://blogbelajar2.blogspot.com/feeds/comments/default?alt=json&callback=md_recent_comments&max-results=5"></script>
Terakhir pratinjau, lalu simpan template.

Modifikasi;

1.  angka 5 (warna biru adalah jumlah komentar terakhir yang ingin ditampilkan)
2.  angka 60 dan 40 adalah ukuran image avatar komentar postingan blog.
3.  Silahkan mencoba bereksperimen sendiri untuk hal-hal lainnya, cobalah.
4.  Ganti http://blogbelajar2.blogspot.com dengan nama blog sobat

Demikian cara membuat widget recent comment dengan avatar atau komentar terakhir di blog. Silakan jika sobat mau mencobanya.,, Semoga bermanfaat ya sob !

Thanks for reading & sharing Kumpulan Artikel

Previous
« Prev Post

1 komentar:

Jika Anda Membaca Artikel Saya Tolong Komentar nya Ya ..
Terima Kasih ..