Membuat Recent Comment Tampilan Avatar Tanpa Gadget

Membuat Recent Comment Tampilan Avatar Tanpa Gadget - Recent Comment adalah menampilkan komentar terbaru atau terakhir pada semua artikel yang sudah di comment. Pada kesempatan ini saya akan membahas cara membuat recent comment tanpa menambah gadget karena kalau pakai gadget sudah banyak pembahasannya heheheee. Membuat recent comment sangat menarik bagi saya pribadi untuk memperindah tampilan blog dan sangat membantu saya mengatahui siapa yang melakukan komentar terbaru atas artikel yang saya buat tanpa perlu saya cek via email / lewat dashbord blog. Recent Comment/komentar sangat dibutuhkan jika anda mempunyai atrikel yang sudah banyak, Visitor yang sudah pasti ada setiap hari maka recent comment perlu dibuat. Pada blog ini recent comment saya buat ada di tampilan footer. Yang membedakan ialah pada tampilan footer blog ini bukan menambah Gadget dari fasilitas yang diberikan oleh blogger. Kalau saya menambah Gadget pada layout blog untuk footer maka tampilannya tidak full, hal ini biasanya menyesuaikan sidebar diatasnya. Inginnya saya membuat footer dengan tampilan full seperti tampilan menu saya diatas, Desaign footer yang saya buat hanya berupa script HTML+CSS , Cuma pada isi footer saya ada tambahan kode java scriptnya, tergantung dari isi footer yang akan dibuat.

Membuat recent comment  dengan menampilkan avatar tanpa menambah gadget sangat mudah. Recent comment ini sudah saya praktekan, Untuk desaign tampilannya akan sama persis dengan recent comment pada blog saya ini. Jika masih tertarik langsung saja ikuti petunjuk saya dibawah ini.

1. Login ke Blogger >> Masuk ke Dashboard Blogger  >> Pilih Template >> Pilih Edit HTML

2. Copy kode di bawah ini kemudian Paste kode tersebut di tempat yang anda ingin tentukan sendiri.

<style type='text/css'> ul.w2b_recent_comments { list-style: none; margin: 0; padding: 0; color: #ffffff; } .w2b_recent_comments li { background: none !important; margin: 0 0 6px !important; padding: 0 0 6px 0 !important; display: block; color: #ffffff; 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: #ffffff; display: block; font-size: 12px; font-style: italic; line-height: 1.4; } </style> <script type='text/javascript'> var numComments = 5, showAvatar = true, avatarSize = 40, roundAvatar = true, characters = 40, showMorelink = false, moreLinktext = "More »", defaultAvatar = "http://www.gravatar.com/avatar/?d=mm", hideCredits = true; </script> <script src='https://my-tqarob.googlecode.com/svn-history/r132/trunk/w2b-recent-comments-w-gravatar.js' type='text/javascript'/> <script src='http://YourNameBlog.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=5' type='text/javascript'/>

3.  Selanjutnya ubah script diatas YourNameBlog.blogspot.com dengan URL blog anda sendiri
4.  Ubah script:diatas   alt=json&callback=w2b_recent_comments&max-results=5   menjadi   alt=json&amp;callback=w2b_recent_comments&amp;max-results=5  

• numComments = 5   Untuk mengubah jumlah komentar temukan 

• showAvatar = true  Untuk menampilkan avatar

• avatarSize = 40   Untuk mengubah ukuran avata

• characters = 40   Untuk mengatur jumlah teks maksimal karakter tampilan komentar

• defaultAvatar = "http:// www.gravatar.com/avatar/?d=mm"   Untuk mengubah gambar default avatar