Rabu, 29 Agustus 2012

1 Widget Recent Comments + Gravatar/Gambar Untuk Blogger

Pada tutorial kali ini saya akan menuliskan panduan/tutorial cara membuat recent comment + gravatar (gambar) di blogger atau cara pasang widget komentar terbaru yang ada gambar si pemberi komentar.

Untuk melihat contoh/demo recent comments + gravatar widget ini bisa kamu lihat pada sidebar kanan blog ini, silakan klik tab COMMENTS, berikut gambarnya:


Cara Pasang Widget Recent Comments + Gravatar Di Blogger



Cara Membuat Recent Comment + Gravatar/Gambar Di Blogger

Tutorial pasang widget recent comment yang ada gambar gravatarnya ini sebenarnya sama saja dengan tutorial pasang widget blogger lainnya, yang membedakannya hanya script saja. Dan sama halnya dengan panduan lainnya, langkah pertama yang harus dilakukan adalah login/masuk dulu ke Dasbor blogger, kemudian ikuti langkah-langkah berikut.

Cara Pasang Widget Recent Comments + Gravatar Untuk Blogspot

1. Klik Tata Letak
Cara Pasang Widget Recent Comments + Gravatar Di Blogger (http://blog.ahmadrifai.net)

2. Klik Tambah Gadget / Add A Gadget
Panduan Pasang Widget Recent Comments + Gravatar Di Blogger (http://blog.ahmadrifai.net)

3. Pilih Gadget Html/JavaScript
Tutorial Pasang Widget Recent Comments + Gravatar (http://blog.ahmadrifai.net)
4. Masukkan Script Recent Comments + Gravatar di dalamnya (jangan lupa klik Edit HTML ya, letaknya di sebelah kanan atas kolom isian), berikut script yang harus dipasang :
<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://blogmahoo.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script>

Catatan :
Silakan Ganti http://blogmahoo.com dengan alamat blog kamu
Untuk menentukan jumlah komentar yang ingin ditampilkan silakan ganti angka 5 pada  numComments  = 5 dan max-results=5
characters  = 30 (Silakan ganti angka 30 dengan jumlah karakter komentar yang ingin kamu tampilkan)
avatarSize  = 30 (Adalah ukuran gambar avatar yang artinya 30x30 px, silakan ganti sesuai keinginan)
http://www.gravatar.com/avatar/?d=mm adalah default avatar, silakan ganti dengan gambar yang kamu inginkan.

5. Simpan (kamu juga bisa memindahkan letak Widget Recent Comments + Gravatar tersebut dengan cara menarik gadget tersebut)
6. Selesai.

Widget Recent Comments + Gravatar ini dibuat oleh pemilik situs www.way2blogging.org, untuk mengunjungi sumber aslinya silakan baca : Recent Comments Widget with Avatar for Blogger/Blogspot.

Nah itulah langkah demi langkah panduan cara pasang widget recent comment untuk blogger yang ada gambar gravatarnya.

Selamat mencoba dan semoga bermanfaat.

1 comment

7 Maret 2013 20.47

ok, juga tampilan blogernya gan, article menarik...
smoga slalu sukses ya gan

have a wonderful day :P

Posting Komentar

[ Dofollow Blog ]

Hargai penulis dengan cara memberikan komentar di artikel ini ya sobat.
Dan berkomentarlah dengan kata-kata yang sopan.

Thanks

Enter your email address:

Delivered by FeedBurner

KeluarJangan Lupa Klik Like Dan Follow ya!

Arsip Blog

Popular Posts

Chat Box

 

Link

    free counters
    IP
    SEO Stats powered by MyPagerank.Net

Followers

Network blog