Cara Membuat Recent Comment Avatar

Masih ingat dengan tulisan terdahulu? atau belum baca? Dulu pernah saya tuliskan, ada 8 widget yang sebaiknya ada di blog kita, salah satu diantaranya adalah Recent Comment. Kembali saya kutip dari tulisan terdahulu itu,

Recent comment, yaitu widget yang menampilkan komentar-komentar terbaru dari blog kita. Karena biasanya sebuah blog identik dengan person sehingga tulisannya itu berasal dari pemikirannya dan bisa dikomentari orang lain. Selain itu akan menambah semangat untuk berkomentar dan menghargai komentarnya.

Untuk itu, kali ini juga Belajar Ngeblog di BLOG akan membahas cara membuat Recent Comment yang lebih menarik, mengapa? Karena recent comment yang akan kita buat bisa menampilkan avatar si komentator, kalau yang biasa melihat di blog yang ada di wordpress, ya seperti itulah tampilannya. Jadi akan ada avatar (gambar) nama, dan isi komentar. Tentunya widget ini akan membuat tampilan blog lebih menarik. Langsung saja kita praktekan!

Cara Membuat Recent Comment Avatar.
1. Login ke akun blogger.com
2. Pilih Tata Letak lalu tambahkan Tambah Gadget > HTML/Javascript
3. Kemudian masukan kode berikut ini:

<style type="text/css">
ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
.tb_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;}
.tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.tb_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  = 50,
characters  = 60,
defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://johnytemplate.googlecode.com/files/recentcomment.js"></script>
<script type="text/javascript" src="http://kurniasepta.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&max-results=5"></script>

4. Sebelum disimpan ganti http://kurniasepta.blogspot.comdengan URL blogmu sendiri. 5 adalah banyaknya komentar yang akan ditampilkan 50 adalah ukuran avatar dan 60 adalah banyaknya karakter komentar yang muncul.
5. Simpan jika sudah selesai. 

Mungkin yang anda cari :

blog

• Cara Buat Background Judul Widget/Gatget blog
• Cara Buat Tombol Back To Top di Blogspot
• Cara Membuat Custom URL Permalink Blogger SEO Friendly
• Cara Buat Breadcrumb Seo Friendly di Blog
• Cara Membuat Breadcrumbs Terindex / Di indeks Google
• Cara Buat Bintang Jatuh dari Kursor
• Cara Membuat Burung Twitter Terbang Di Blogspot
• Beritahu Google Untuk Menjelajahi (Crawl) Blog Kamu
• Cara Buat Tombol Share Dengan Efek jQuery Nudging
• SEO | Kumpulan Tips Trik & Info | Tools & Add-Ons
• .EDU Backlink | Cara Mendapatkan Backlink Dofollow Gratis
• Alexa Rank | Cara Meningkatkan Ranking Alexa
• Cara Pasang Page 123 Navigation dengaN java script html
• cara membuat 123 Page Number Navigation for Blogger
• Cara membuat dan memasang KATEGORI BlogSPOT dengan Background Animasi
• Cara Membuat Background Animasi pada Judul Posting
• Cara Mudah Membuat Kotak Komentar Facebook
• Cara Mematikan Tombol Ctrl A Ctr C dan Disable Klik Kanan | Anti Copas
• Cara Membuat Blog Agar Tidak Bisa Di Copy Paste
• Cara Membuat Menu Navigasi Dengan Animasi
• Cara Membuat Colorful JQuery Menu Untuk Blog
• Cara Membuat Menu Horizontal Drop Down Animasi Untuk Blog
• Cara Membuat Tombol Back To Top Dengan jQuery
• Cara Memberi Background Pada Judul Posting blog

URL : https://solkhres.blogspot.com/2012/11/cara-membuat-recent-comment-avatar.html