Cara Membuat Widget Komentar Blogspot Dengan Avatar

Cara Membuat Widget Komentar Blogspot Dengan Avatar. Assalamualaikum wr.wb, pada kesempatan kali ini Kang Aluha akan memberikan tutorial blogger blogspot mengenai cara membuat / menambahkan widget komentar terbaru (Recent Comments) di Blogspot. Widget Komentar Terbaru ini dilengkapi dengan mini avatar / foto profile. Tujuan dari Avatar Mini pada widget ini adalah sebagai pelengkap dan menambahkan kesan keren pada widget tersebut.

Pada widget komentar terbaru (Recent Comment) ini tidak akan memunculkan komentar Anda atau si pemilik Blog, karena cara kerjanya hanya menampilkan komentar dari akun lain yang berkomentar pada blog Anda dan akan menyembunyikan komentar Anda. Pada widget ini juga Anda bisa mengatur berapa jumlah komentar yang muncul, berapa karakter kata yang akan di munculkan, dan masih banyak yang menarik lainnya.

widget komentar terbaru (recent comments)

Nah jika Anda ingin menambahkan widget komentar terbaru (Recent Comment) ini di blog Anda, silahkan ikuti tutorialnnya di bawah ini.

Penerapan Widget Komentar Terbaru di Blogspot
  • Login ke www.blogger.com milik Anda
  • Pada Dashboard pilih Tata Letak → Tambahkan Gadget → Pilih HTML/Javascript
  • Kemudian masukan kode widget komentar terbaru di bawah ini kedalamnya
<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{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;}
.sakahayang_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.sakahayang_recent_comments li span{margin-top:4px;color: #666;display: block;font-size: 11px;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 = 40,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
maxfeeds=20,
adminBlog='Giovani Aluha';
//]]>
</script>
<script type="text/javascript" src="http://btreaders.googlecode.com/files/rcwanau.js"></script>
<script type="text/javascript" src="http://njleput-tkj.blogspot.com/feeds/comments/default?alt=json&callback=sakahayang_recent_comments&&max-results=20"></script>

Keterangan Tambahan
1. numComments = 5, (Jumlah komentar yang akan ditampilkan)
2. showAvatar = true, (Tampilkan avatar mini atau "false" untuk menonaktifkan avatar mini)
3. avatarSize = 30, (Ukuran pada avatar mini)
4. roundAvatar = true, (Tampilan avatar yang muncul berbentuk lingkaran , ganti "false" avatar berbentuk kotak)
5. characters = 40, (Jumlah karakter atau panjangnya komentar yang muncul)
6. defaultAvatar = "http://www.gravatar.com/avatar/?d=mm", (Foto default avatar dan bisa Anda ganti)
7. hideCredits = true;
8. maxfeeds=20,
9. adminBlog='Giovani Aluha'; (Nama yang akan disembunyikan)
10. http://njleput-tkj.blogspot.com/ (Ganti dengan alamat blog/website Anda)
  • Jika sudah disesuaikan tahap akhir pilih Simpan (Save)

Demikianlah tutorial blogger blogspot mengenai cara membuat widget komentar terbaru pada sidebar blog. Semoga artikel yang berjudul Cara Membuat Widget Komentar Blogspot Dengan Avatar ini bermanfaat dan berguna.

Terima kasih.
Share on Google Plus

About Unknown

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.
    Blogger Comment
    Facebook Comment

0 comments:

Post a Comment