Sebenernya tutorial seperti ini memang sudah banyak banget yang membuat.....tapi karna kemarim aq sempat memakai template CSS3 dan kebutulan list komentarnya tidak ada avatarnya saya tergugah buat ngasih avatar........... eh ternyata aq dikecewakan, karena aq coba memakai tutorial2 tentang Cara pasang avatar di komentar blogger tidak bisa lagi....huft >.<
Karena tidak bisa digunakan di template css3 akirnya kembali ketemplate awal....dan nguprek2 CSS yg ada di template lama dan template CSS3 wat cari tau permasalahanya.....Setelah aq temukan kenapa tidak bisa tampil avatar di ditemplate CSS3... Barulah kepikiran buat mosting Cara pasang avatar di komentar blogger atau bisa juga cara memasang avatar dikomentar template CSS3.
Sebenerya untuk menampilkan avatar dikomentar itu mudah. Cukup mengaktifkannya dengan masuk ke menu Setting -> Comments lalu pada bagian "Show profile images on comments" pilih YES. selesai........
Tapi cara ini hanya berlaku untuk template tertentu saja khususnya template yang disediakan oleh blogger dan hasilnya kurang optimal dimana avatar hanya muncul jika pengunjung memberi komentar dengan blogger id. Sedangkan yang berkomentar dengan open id atau anonymous, avatar tidak muncul.
Sekarang mari praktekan Cara pasang avatar di komentar blogger. caranya dibawah ini...
1. Pertama-tama masuk dululah login ke blogger sob.jangan kefacebook lo yach...hehe.
2. Masuk ke menu PERANCANG >> EDIT HTML
3. Beri centang pada "Expand Widget Templates". Agar lebih aman download dulu template sobat. Jaga2 juga lo g bs hehehe maklum cara ini bukan dari guru blogger.
4. selanjutnya cari kode berikut:
<dl class='comments-block' id='comments-block'>
kalo tidak ditemukan cari
<dl id='comments-block'>
5. Kalo sudah ketemu dari salah satu code diatas ganti dengan code dibawh ini:
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
6. Setelah itu cari kode berikut:
<a expr:name='data:comment.anchorName'/>
7. Ganti kode tersebut dengan kode dibawah ini:
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<div expr:class='data:comment.avatarContainerClass'>
<data:comment.authorAvatarImage/>
</div>
</b:if>
8. Setelah itu tambahkan kode css berikut diatas ]]></b:skin>
#comments-block .avatar-image-container img {
background: #fff url (https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKc6Yy7ogseBx-00eTpCA6PLJ58Zimb9s83ThlTt05uDqFO5S728MPSORhN_KBe6E-eKoB4BxhFxcR8cMbRHkcjDWV5cK72fuzMr5llS9pzleLal4gpOj-hS2yCU_aq5JnzBca03Y6MbMl/s1600/NoPictureDark32.jpg) no-repeat left top;
width:32px;
height:32px
}
Keterangan:
Teks yang berwarna merah merupakan alamat gambar untuk avatar anonymous. Sedangkan teks yang dicetak tebal merupakan ukuran avatar. sobat bisa menggantinya sesuai keinginan kalian
9. Templatenya disimpan ya...
10. SELAMAT BEREXPERIMEN SOB!!!
Thank's atas infonya.sayang saya nggak bisa mencoba cara diatas.karena ngeblog lewat ponsel semuanya jadi halangan.tapi tak apalah.salam kenal.http://ego-390.blogspot.com
BalasHapuspas,,,mantap sob,,,thank U
BalasHapus@Ego Dafma Dasabisa kug sebenarnya hehehe...... trimakasi kunjunganya sob
BalasHapus@Phinisi Boat sama2 ternyata ada juga manfaatnya postingan ini
BalasHapuskalau avatra blog q tak lepas soalnya kurang bagus buat dilihat kalau yg coment g dalam posisi login
BalasHapusNice Info gan!!
BalasHapusOhiya agan agan kalo ada waktu berkunjung ke blog saya ya!
http://ralfar-tech.blogspot.com
biarpun telat karna lg modif template,makasih y agan atas infonya ai lop u pull he he he
BalasHapusberguna banget postingan ini
BalasHapusthank artikel sobat.sangat bermanfaat.......
BalasHapuswah thx banget nih tutorialnya, :D
BalasHapus@Rizky2009:itu yang buat comment anonim tinggal diganti ja dgn gambar yg anda suka broo jadi ga ngurangin keindahan...hehehehehe
BalasHapus@Technology,Science and etc. : siap jalan2 balik broo
BalasHapus@Miss Rinda wokeh sob telatmu tak terima...hehehehe ai lop u pull juga :p
BalasHapus@Chua Cyborg : sama2 gan
BalasHapus@Zellic: sama2 gan moga bermanfaat.
BalasHapus