Kali ini saya akan share Cara Membuat Widget Recent Comment Dengan Avatar Di Blog #2. Mungkin kamu sudah tidak asing lagi dengan widget ini. widget recent comment ini menampilkan komentar terbaru dari konten-konten pada blog kamu. widget ini dilengkapi dengan tampilan foto profil pemberi komentar dan tentunya menampilkan kata-kata dalam komentar.
Keuntungan dari widget ini, mungkin jika kamu tidak mengaktifkan moderasi komentar, kamu bisa mengetahui komentar-komentar yang masuk pada konten blog kamu. sehingga kamu bisa mengontrol komentar tersebut apakah perlu balasan atau perlu dihapus (karena dianggap spammy).
Melalui HTML/JavaScript :
Oke saya rasa tidak perlu panjang lebar, ayo di mulai...
Seperti biasa, langkah pertama yang harus kamu lakukan adalah masuk dahulu ke blogger.com menggunakan akun kamu, kemudian.
Ikutilah langkah-langkah di bawah ini :
1. Klik Tata Letak.
2. Klik Tambah Gadget.
3. Pilih Gadget HTML/Javascript.
4. Kemudian (copy & paste Kode di bawah ini untuk memasukkan widget ini pada blog kamu).
<div style="overflow:auto;width:auto;height:378px;border:1px
solid #00ff00; padding:10px; margin:0 auto;background:#3eb5da;"> <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:#ffffff;-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: #ffffff;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 = 35,
roundAvatar = true,
characters = 250,
defaultAvatar = "",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src=" https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-widget-recent-comments-dengan-avatar-di-blog-2.js "></script> <script type="text/javascript" src="http://tutorial-blog-eno.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=100"></script></div>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-widget-recent-comments-dengan-avatar-di-blog-2.html" target="_blank">Mau Seperti Ini?</a></small>
<script type="text/javascript">
//<![CDATA[
// Recent Comments Settings
var
numComments = 5,
showAvatar = true,
avatarSize = 35,
roundAvatar = true,
characters = 250,
defaultAvatar = "",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src=" https://sites.google.com/site/tutorialblogeno/javascript/cara-membuat-widget-recent-comments-dengan-avatar-di-blog-2.js "></script> <script type="text/javascript" src="http://tutorial-blog-eno.blogspot.com/feeds/comments/default?alt=json&callback=w2b_recent_comments&max-results=100"></script></div>
<small><a href="http://tutorial-blog-eno.blogspot.com/2014/10/cara-membuat-widget-recent-comments-dengan-avatar-di-blog-2.html" target="_blank">Mau Seperti Ini?</a></small>
Keterangan :
- height:378px; adalah ukuran tinggi, silahkan kamu ganti dengan selera yang kamu mau.
- Warna purple adalah kode warna, silahkan kamu ganti dengan selera yang kamu mau.
- Agar lebih mudah menemukan kode warna yang kamu inginkan : Klik Di Sini
- numComments = 5, adalah jumlah komentar, silahkan kamu ganti dengan selera yang kamu mau.
- characters = 250, adalah jumlah karakter, silahkan kamu ganti dengan selera yang kamu mau.
- Warna orange adalah link kode "JavaScript" blog.
- Silahkan kamu ganti http://tutorial-blog-eno.blogspot.com/ dengan URL blog kamu sendiri.
5. Simpan Pengaturan.
Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.
█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno
Selamat Mencoba, Semoga Berhasil & Mudah-Mudahan Bermanfaat.
█████████████████████████████████████████████████████████████████
Jangan Lupa Like, Comment & Share Artikel Ini Ya » Terima Kasih Atas Kunjungannya » Salam : Eno Sutrisno
Ditulis Oleh : Tutorial Blog Eno » Di Sini Adalah Inspirasi Untuk Sobat Blogger Semua.
Saat ini kamu sedang membaca artikel tentang Cara Membuat Widget Recent Comments Dengan Avatar Di Blog #2. silahkan kamu Copy-Paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link di bawah ini sebagai sumbernya. INGAT : saling menghargai kreatifitas sesama sobat blogger oke.
Tidak ada komentar:
Posting Komentar
███████████████ Peraturan Berkomentar Di Blog Ini :
» Berkomentarlah dengan baik dan sopan.
» Dilarang spam, SARA, pornografi, junk, dan sebagainya.
» Jangan membuat keributan/kekacauan.
» Jangan mencantumkan LIVE LINK di komentar ini.
» Kalau kamu ingin copy-paste dari blog ini ke blog kamu (harap cantumkan LINK SUMBERNYA).
» Jika kamu melanggar salah satu peraturan tersebut, maka komentar kamu akan saya hapus dari blog ini.
███████████████ Terima kasih atas pengertian, kunjungan dan pesannya.
» Pengunjung yang baik itu adalah yang meninggalkan komentar, walaupun itu hanya ucapan "Terima Kasih".