Random Post

Home » » Membuat Komentar Terbaru dengan Gambar

Membuat Komentar Terbaru dengan Gambar


Membuat Komentar Terbaru dengan Gambar

Halo sobat blog trik dan tips, kali ini kita akan membuat komentar terbaru dengan gambar. Widget ini menggunakan javascript dan sangat mudah untuk diinstal. Sobat dapat memasang widget ini pada blog anda untuk sekedar memperindah atau mempercantik blog. Anda dapat mengetahui apabila seseorang berkomentar pada blog anda. Gambar komentator ditampilkan dalam bentuk lingkaran sehingga memberikan efek yang sangat menarik. Jika sobat ingin memasangnya pada blog ikuti langkah berikut ini:

1. Login ke Blogger
2. Masuk ke Rancangan --> Edit Laman
3. Tambahkan gadjet lalu pilih HTML/Javascript
4. Masukan kode berikut ini:
<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 = 30,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://bloggerblogwidgets.googlecode.com/svn/trunk/w2b-recent-comments-w-gravatar.js"></script>
<script type="text/javascript" src="http://blogtrikdantips.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

5. Selanjutnya sobat tinggal menganti kode berwarna merah dengan url blog anda.
6. Jika sobat ingin mengedit tampilan widget ini berikut adalah penjelasannya:
Kode berwarna hijau adalah jumlah komentar yang ditampilkan
Kode berwarna biru aadalah ukuran gambar komentator
Kode berwarna orens adalah rincian komentar dari komentator
7. Terakhir simpan gadjet anda.
Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di Creating Website

0 komentar:

Post a Comment

 

Copyright © 2013. 2000 Shared - All Rights Reserved

Proudly powered by Blogger