Cara membuat widget recent comment di blogger

Advertisemen
Diposting kali ini saya akan membahas mengenai cara membuat recent comment atau biasa anda sebut juga sebagai komentar terbaru, recent comment adalah widget yang akan menampilkan komentar terbaru yang terdapat di blog milik anda dengan bantuan widget ini akan mempermudah anda mengetahui jika ada yang berkomentar di blog anda dan agar anda bisa merespon dengan cepat pula.

selain tampilnya komentar kali ini akan tampil pula avatar para komentar di widget yang akan saya berikan ini, untuk dapat membuat widget recent comment ini anda cukup mengikuti langkah-langkah yang akan saya berikan dibawah ini :

Cara membuat widget recent comment di blogger
  1. Silahkan login ke blogger anda
  2. Langsung menuju Tata Letak
  3. Lalu pilih Tambah Gadget
  4. Pilih HTML / Java script
  5. Masukan code dibawah ini :
Cara membuat widget recent comment di blogger
Cara membuat widget recent comment di blogger

<div style="overflow:auto;width:auto;height:300px;border:1px solid #ccc; padding:10px; margin:0 auto;background:#fff;">
<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  = 150,
 defaultAvatar  = "",
 hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="https://sites.google.com/site/harysuka/top-comentar/Recent_Comments.js?attredirects=0&d=1"></script>
<script type="text/javascript" src="http://urlblog.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=100"></script>
Keterangan warna merah pada code script widget recent comment diatas :
  1. height:300px : angka 300 adalah ukuran tinggi dari widget yang akan kita buat.
  2. #fff : adalah warna latar atau becground dari widegt recent comment yang akan kita buat.
  3. numComments  = 5 : angka lima menunjukan berapa jumlah komentar yang akan anda tampilkan di widget recent comment yang akan dibuat ini.
  4. showAvatar  = true : ini adalah perintah untuk menampilkan avatar atau tidak jika anda ingin menampilkan avatar biarkan saja tetap true dan jika anda tidak ingin menampilkan avatar silahkan tuliskan false sehingga akan menjadi showAvatar = false.
  5. characters  = 150 : angka 150 menunjukan jumlah karakter komentar yang akan anda tampilkan pada widget recent comment ini meskiput berisi 1000 karakter pada komentar aslinya tapi jika anda set angka 150 maka hanya akan tetap tampil 150 karakter.
  6. max-results=100 : ini juga adalah maksimal komentar yang akan tampil tapi tidak perlu di ubah jika anda tidak mendapatkan kendala jumlah komentar dan jika mendapat kendala silahkan ubah dan sesuai kan dengan angka pada numComments  = 5.
sebagai contoh widget recent comment ini silahkan lihat widget sebelah kanan saya yang bernama komentar terbaru disitu saya hanya mensetting 2 komentar yang akan tampil, jika anda mengalami kesulitan dalam memasang widget yang satu ini atau ada hal yang ingin anda tanyakan silahkan tonggalkan pertanyaan anda di komentar atau hubungi kontak yang telah kami sediakan tentu saja kami akan merespon dengan cepat, terima kasih telah membaca posting kami.
Advertisemen

Disclaimer: Gambar, artikel ataupun video yang ada di web ini terkadang berasal dari berbagai sumber media lain. Hak Cipta sepenuhnya dipegang oleh sumber tersebut. Jika ada masalah terkait hal ini, Anda dapat menghubungi kami disini.
Related Posts
Disqus Comments
© Copyright 2017 Yuli Agustiani - All Rights Reserved - Created By BLAGIOKE Diberdayakan oleh Blogger