Home » » Membuat Recent Comment Avatar Tanpa Edit HTML

Membuat Recent Comment Avatar Tanpa Edit HTML

Posted by Solution Support on Sabtu, 27 Januari 2018

Sebenarnya sudah banyak blog atau web yang menampilkan Recent Comment With Avatar, serta cara membuatnya sudah banyak dijumpai pada situs- situs blog lainya. Namun bagi sobat yang mungkin belum tahu caranya, berikut ini langkah-langkahnya.

  1. Login ke blogger dengan akun Anda.
  2. Di dashboard masuk ke layout
  3. Setelah itu anda pilih add gadget >> HTML/Javascript
  4. Masukkan kode-kode di bawah ini pada kotak HMTL/Javascript
<div style="overflow:auto;width:auto;height:250px;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  = 100,
 showAvatar  = true,
 avatarSize  = 30,
 roundAvatar = true,
 characters  = 200,
 defaultAvatar  = "",
 hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="https://sites.google.com/site/bloggerbugis/js/Recent_Comments_New_Bloggerbugis.js"></script>
<script type="text/javascript" src="http://siniput.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=100"></script>

<div style="font-size:10px; padding:3px;margin-bottom:5px;float:right"><a
href="http://siniput.blogspot.com/2012/05/recent-comment-komentar-avatar.html" target="_blank"> Get This Widget</a></div>
</div>

  • 250px adalah tinggi kotak Recent Comment, silahkan ganti sesuai kesukaan.
  • fff adalah kode warna untuk background kotak. fff adalah kode warna putih, jika menginginkan kode warna yang lain silahkan ganti sesuai kesukaan. Untuk melihat kode warna toolnya ada disini.
  • 100 adalah jumlah komentar yang akan di tampilkan di dalam kotak Recent Komentar.
  • true yang pertama adalah kode untuk menampilan Gambar Avatar profile. Jika ingin menghilangkan Foto Profil / Avatar, ganti true dengan false
  • 30 adalah ukuran / besar foto profil. Sama seperti sebelumnya, ganti 30 dengan angka yang anda inginkan
  • true yang kedua adalah kode untuk membuat foto profil komentator berbentuk bundar. Ganti true dengan false jika anda ingi membuat avatar profil berbentuk kotak
  • 200 adalah jumlah karakter / huruf komentar yang akan di tampilkan. Silahkan ganti angkanya sesuai dengan yang anda inginkan.
  • Ini adalah bagian yang paling penting. Ganti http://siniput.blogspot.com dengan URL / alamat blog anda agar widget Recent Comments yang ada di blog anda tidak menanmpikan komentar yang ada di blog saya

Thanks for reading & sharing Solution Support

Previous
« Prev Post

0 komentar:

Posting Komentar