Menambah Widget Komentar Terbaru Dengan Gambar Avatar - Hallo sahabat Rumah Musafir Ilmu, Pada Artikel yang anda baca kali ini dengan judul Menambah Widget Komentar Terbaru Dengan Gambar Avatar, kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Blogspot, Artikel Widget, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

Judul : Menambah Widget Komentar Terbaru Dengan Gambar Avatar
link : Menambah Widget Komentar Terbaru Dengan Gambar Avatar

Menambah Widget Komentar Terbaru Dengan Gambar Avatar

Bissmillah... Semalam kita baru saja mengupas tuntas tentang cara Membuat Effect Box Circle untuk Gambar Banner dengan CSS. Kali ini Tutorial Jitu akan memberikan anda Widget yang Jitu yang sangat cocok untuk mempercantik tampilan Recent Comment artikel blog anda.

Untuk mendapatkan tampilan yang menarik pada blog kita tidak lah mudah. Ada kalanya kita harus mencocokkan warna widget dengan warna latar belakang blog kita. Namun tutorial untuk Menambah Widget Komentar Terbaru Dengan Gambar Avatar ini insyaAllah akan cocok untuk semua versi latar belakang dari sidebar blog anda. Namun sayangnya widget ini menggunakan JavaScript yang mungkin sedikit mengganggu loading blog anda. Tapi tidak ada salahnya untuk mencoba menggunakan widget ini, karena dari segi tampilan cukup professional, dan menurut saya widget ini tidak terlalu memberatkan loading blog anda. Silahkan anda lihat screenshot dari Widget ini:

Saya rasa sudah cukup jelas untuk keterangan dari widget ini, langsung saja kita menuju tutorial pembuatannya.

Menambah Widget Komentar Terbaru Dengan Gambar Avatar

1. Masuk ke Dashboard blog anda
2. Pilih menu Tata Letak dan Tambahkan Gadget
3. Ambil HTML/JavaScript, kemudian masukkan script berikut kedalamnya:

<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 type="text/javascript" src="http://tipstrikblogging.googlecode.com/files/RecentComment-W-Gravatar.js"></script>
<script type="text/javascript" src="http://tutorial.akhbarislam.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5"></script></div>

Keterangan:
-  numComments = 5, ganti angka 5 dengan jumlah komentar yang ingin anda tampilkan.
-  avatarSize = 40, ganti 40 untuk mengatur besarnya gambar avatar komentar
-  characters = 100, ganti 100 dengan jumlah karakter komentar yang ingin anda tampilkan.
-  w2b_recent_comments&max-results=5, ganti angka 5 sesuai dengan "numComments=5" (Jumlah max-results dan numComments harus sama).
-  Ganti URL bercetak kuning dengan alamat URL blog anda.

4. Simpan, dan silahkan cek di tampilan blog anda.

Akhirnya selesai juga artikel tentang Menambah Widget Komentar Terbaru Dengan Gambar Avatar ini, semoga bermanfaat bagi kita semua. Jika berhasil jangan lupa ucapkan alhamdulillah, dan jika terjadi kegagalan, agar sekiranya sobat tidak sungkan untuk berdiskusi langsung di form komentar dibawah.

Keyword: Menambah Widget Komentar Terbaru Dengan Gambar Avatar | Tutorial Jitu Akhbar Islam

Demikianlah Artikel Menambah Widget Komentar Terbaru Dengan Gambar Avatar

Sekianlah artikel Menambah Widget Komentar Terbaru Dengan Gambar Avatar kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Menambah Widget Komentar Terbaru Dengan Gambar Avatar dengan alamat link http://bismillah-go.blogspot.com/2013/06/menambah-widget-komentar-terbaru-dengan.html