Download this Blogger Template by Clicking Here!

Widget Komentar Terkini dengan Avatar plus Hidden Admin Comment

Dapat permintaan dari Bu Dey untuk bisikin cara membuat widget komentar terkini. Setelah saya wira-wiri antar universitas dunia maya, akhirnya nemu juga yang kayaknya pas buat bu Dey.

Widget komentar terkini ini nemu di blog Kang Ismet dan Kang Asep. Dilengkapi dengan avatar plus hidden comment author. Untuk cara pasangnya login seperti biasa di akun blogger anda. Klik Template >> Tata Letak >> Tambahkan Gadget, lalu pilih HTML/JavaScript.

Masukkan kode di bawah ini.

<style type="text/css">
    ul.sakahayang_recent_comments{list-style:none;margin:0;padding:0;}
    .sakahayang_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;}
    .sakahayang_recent_comments li .avatarImage{border: 2px solid #A9A9A9; padding:0px;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;}
    .sakahayang_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
    .sakahayang_recent_comments li span{margin-top:4px;color: #000000;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  = 40,
 roundAvatar = true,
 characters  = 40,
 defaultAvatar  = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhW6d2vKCCJxdDnC79ezDLkM6gjU5GPJ-DZj9ncGqUTDeXfU9c9A6sJcQUc2XICmE8v7O0jBIDnPRt5bWPwbZC5repkxfxIW0D0P0sbFThNMGYTnJ1RB45KZ5xW13kBTG4Va6vgLGyFHiw/s269-c-o-k/default_avatar.png",
 hideCredits = true;
 maxfeeds=20,
 adminBlog='Lozz Akbar';
//]]>
</script>
<script type="text/javascript" src="http://btreaders.googlecode.com/files/rcwanau.js"></script>
<script type="text/javascript" src="http://goyangsithik.blogspot.com/feeds/comments/default?alt=json&callback=sakahayang_recent_comments&&max-results=20"></script>
  • numComments  = 5 : Jumlah komen terkini yang dimunculkan (ganti sesuai keinginan) 
  • avatarSize  = 40 : ukuran avatar 
  • characters  = 40 : Jumlah preview karakter komen yang dimunculkan 
  • defaultAvatar  = "bisa diganti dengan URL icon avatar anda sendiri" 
  • maxfeeds=20 : Jumlah komentar yang diload olh Json script, jumlahnya harus sama dengan max-result dan lebih besar dari numComments. 
  • adminBlog='Lozz Akbar' : ganti dengan nama admin anda (untuk menghilangkan komen anda sendiri) 
  • http://goyangsithik.blogspot.com : ganti dengan alamat blog anda
Jika selesai klik SIMPAN 
 
Anda juga bisa mengotak-atik sendiri CSSnya, macam warna border, background, bentuk avatar dan lain sebagainya sesuai selera.. Selamat berkreasi.