Cara Membuat Recent Comment v3 Blogger Keren

Cara Membuat Recent Comment v3 Blogger Keren - Sudah lama saya tidak posting dan membuat tutorial lagi dalam beberapa hari belakangan ini, selain dikarenakan saya sibuk didunia nyata, saya mengurusi data-data saya untuk mencari pekerjaan yang lebih real dari sekedar menjadi seorang Blogger yang sudah saya jalani selama 3 tahun belakngan ini.

Tapi, pada hari ini saya sempatkan untuk menulis artikel lagi diblog saya ini, untuk sobat pembaca setia blog Semua-Tutorialku. pada kesempatan kali ini, saya ingin berbagi trik simple yang mungkin sudah banyak yang posting, dan membuat tutoril serupa, yaitu Cara Membuat Recent Comment v3 Blogger Keren.

Saya rasa anda semua sudah mengerti Apa Itu Recent Comment Blogger? dan Apa Fungsinya? oleh karna itu saya tidak akan menjelaskan tentang hal tersebut kepada anda lagi. Selanjutnya, kita langsung saja dengan Cara Membuat dan Memasang Widget Recent Comment v3 Blogger yang keren ini di Blog anda. Silahkan ikuti langkah-langkahnya dibawah ini.

Cara Membuat Recent Comment v3 Blogger Keren
1. Masuk ke akun Blogger
2. Kemudian pilih Tata Letak > Add Gadget > HTML/Javascript
3. Lalu paste kode dibawah ini kedalam konten box gadget tsb.

 <style type="text/css" scoped>
ul.allbloggertricks_recent{list-style:none;margin:0;padding:0;}
.allbloggertricks_recent li{background:none!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;border-radius:9px;max-height:100px;-webkit-transition-duration:.5s;-moz-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s;-webkit-transition-property:0;-moz-transition-property:0;-o-transition-property:0;transition-property:transform;margin:0 0 6px!important;padding:3px!important}
.allbloggertricks_recent li:hover{border:1px solid #ddd;
-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-o-transform:rotate(6deg) }
.allbloggertricks_recent a {text-decoration:none;}
.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;width:35px;height:35px}
.allbloggertricks_recent li span{margin-top:4px;color: #222;display: block;font-size: 12px;line-height: 1.4;}

</style>
<script type="text/javascript">
//<![CDATA[
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 35,
 roundAvatar = true,
 characters  = 40,
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = true;
 maxfeeds=50,
 adminBlog='Your Name';
//]]>
</script>
<script type="text/javascript" src="http://files.allbloggertricks.com/Scripts/abt-recent-commentsv3.js"></script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&amp;callback=allbloggertricks_recent&amp;&amp;max-results=50">
</script> 

Konfigurasi Widget:

1. numComments - menampilkan jumlah komentar.
2. showAvatar - untuk menampilkan avatar komentar, ganti 'false' untuk menghilangkan.
3. avatarSize - ukuran avatar pada komentar dalam pixel.
4. roundAvatar - membuat avatar menjadi Bulat, ganti 'false' untuk normal.
5. characters - banyaknya karakter dlm komentar yg ditampilkan.
6. defaultAvatar - gambar default avatar komentar.
7. adminBlog - ganti dengan nama 'Admin Blog' anda, untuk menyembunyikan komentar admin.

Updates Widget:
v.1 - 11.01.2012

• Released
• Script by Harish Dasari

v.2 - 14.05.2012

• Script modified by Asep
• Admin removed Comments

v.3 - 09/15/2013

• Script modified by Afandi Kusuma
• Expanded clickable area
• Fixed HTML5 validation issues by Kang Ismet
• Added Animation on hover by AllBloggerTricks

Script by: http://www.allbloggertricks.com/2013/10/recent-comments-widget-v3-for-blogger.html

Nah.. sekarang anda sudah Cara Membuat Recent Comment v3 Blogger Keren diblog, dan anda dapat melihat hasilnya sekarang dengan melihat komentar yang telah muncul. Jika blog anda belum memiliki komentar, silahkan anda uji coba dengan memberi komentar baru di artikel anda. Selamat mencoba.

Jika anda memiliki masalah dalam menerapkan tutorial kali ini, anda bisa berkomentar dibawah ini untuk bertanya atau sebagainya. Semoga bermanfaat!