Masih ingat dengan tulisan terdahulu? atau belum baca? Dulu pernah saya tuliskan, ada 8 widget yang sebaiknya ada di blog kita, salah satu diantaranya adalah Recent Comment. Kembali saya kutip dari tulisan terdahulu itu,
Recent comment, yaitu widget yang menampilkan komentar-komentar terbaru dari blog kita. Karena biasanya sebuah blog identik dengan person sehingga tulisannya itu berasal dari pemikirannya dan bisa dikomentari orang lain. Selain itu akan menambah semangat untuk berkomentar dan menghargai komentarnya.
Untuk itu, kali ini juga Belajar Ngeblog di BLOG akan membahas cara membuat Recent Comment yang lebih menarik, mengapa? Karena recent comment yang akan kita buat bisa menampilkan avatar si komentator, kalau yang biasa melihat di blog yang ada di wordpress, ya seperti itulah tampilannya. Jadi akan ada avatar (gambar) nama, dan isi komentar. Tentunya widget ini akan membuat tampilan blog lebih menarik. Langsung saja kita praktekan!
Cara Membuat Recent Comment Avatar.
1. Login ke akun blogger.com
2. Pilih Tata Letak lalu tambahkan Tambah Gadget > HTML/Javascript
3. Kemudian masukan kode berikut ini:
<style type="text/css">
ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
.tb_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;}
.tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.tb_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 = 50,
characters = 60,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://johnytemplate.googlecode.com/files/recentcomment.js"></script>
<script type="text/javascript" src="http://apricyber.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&
max-results=5"></script>
4. Sebelum disimpan ganti http://apricyber.blogspot.com dengan URL blogmu sendiri. 5 adalah banyaknya komentar yang akan ditampilkan 50 adalah ukuran avatar dan 60 adalah banyaknya karakter komentar yang muncul.
5. Simpan jika sudah selesai.
Terima kasih atas kungjungan nya...
Recent comment, yaitu widget yang menampilkan komentar-komentar terbaru dari blog kita. Karena biasanya sebuah blog identik dengan person sehingga tulisannya itu berasal dari pemikirannya dan bisa dikomentari orang lain. Selain itu akan menambah semangat untuk berkomentar dan menghargai komentarnya.
Untuk itu, kali ini juga Belajar Ngeblog di BLOG akan membahas cara membuat Recent Comment yang lebih menarik, mengapa? Karena recent comment yang akan kita buat bisa menampilkan avatar si komentator, kalau yang biasa melihat di blog yang ada di wordpress, ya seperti itulah tampilannya. Jadi akan ada avatar (gambar) nama, dan isi komentar. Tentunya widget ini akan membuat tampilan blog lebih menarik. Langsung saja kita praktekan!
Cara Membuat Recent Comment Avatar.
1. Login ke akun blogger.com
2. Pilih Tata Letak lalu tambahkan Tambah Gadget > HTML/Javascript
3. Kemudian masukan kode berikut ini:
<style type="text/css">
ul.tb_recent_comments{list-style:none;margin:0;padding:0;}
.tb_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;}
.tb_recent_comments li .avatarImage{padding:3px;float:left;margin:0 6px 0 0;position:relative;overflow:hidden;}
.tb_recent_comments li img{padding:0px;position:relative;overflow:hidden;display:block;}
.tb_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 = 50,
characters = 60,
defaultAvatar = "http://www.gravatar.com/avatar/?d=mm",
hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="http://johnytemplate.googlecode.com/files/recentcomment.js"></script>
<script type="text/javascript" src="http://apricyber.blogspot.com/feeds/comments/default?alt=json&callback=tb_recent_comments&
max-results=5"></script>
4. Sebelum disimpan ganti http://apricyber.blogspot.com dengan URL blogmu sendiri. 5 adalah banyaknya komentar yang akan ditampilkan 50 adalah ukuran avatar dan 60 adalah banyaknya karakter komentar yang muncul.
5. Simpan jika sudah selesai.
Terima kasih atas kungjungan nya...
Senin, 20 Agustus 2012
//
Label:
Tips Blog
//
3
komentar
//
3 komentar to "Membuat Recent Comment Avatar"
Blog Archive
-
▼
2012
(286)
-
▼
Agustus
(50)
-
▼
Agu 20
(16)
- Membuat Recent Comment Avatar
- Membuat Recent Post Per Label
- Membuat Huruf Besar pada Awal Teks Postingan
- Menambahkan Lencana Google+ dan Button +1
- Mengatasi Lupa Alamat Email Untuk Masuk Blogger
- Membuat Hari dan Tanggal Otomatis di Blog
- Rahasia Membuat Blog yang Ramai Dikunjungi
- Cara Kembali ke Dasbor Lawas Blogger
- Membuat Efek Drop Shadow Pada Foto di Blog
- Menghilangkan Garis Bawah Pada Link di Blog
- Label di Blogger dan Cara Mengoptimalkannya
- Cara Setting Permalink di Blogspot Agar SEO
- Daftarkan Sitemap Blog ke Google Webmaster Tools
- Mengintegrasikan Blog dengan Halaman Google+
- Cara Membuat Kotak Permalink di Bawah Postingan
- Download Template Blogspot Bargaya Toko Online
-
▼
Agu 20
(16)
-
▼
Agustus
(50)
ferry rinaldi says:
Tips yang sangat bermanfaat, melihat tulisan ini saya terinspirasi untuk memposting konten yang bermanfaat buat pengunjung blog, Thank atas sharing tipsnya.
Obat Herbal Migrain says:
Nice Info Gan Sangat Bermanfaat
indonime says:
nice info, sangat membantu... minta referensi yang lebih lengkap dunk