Cara Memasang Avatar Untuk Komentar Anonymous/Name URL

Kali ini solcom akan share cara meberikan avatar pada komentar. Sebenarnya untuk memunculkan avatar cukup mudah, tinggal login, pilih setelan,lalu pilih post dan komentar, klik "ya" pada Tampilkan Gambar Dengan Lighbox, selesai.
Tapi cara itu hanya menampilkan avatar untuk seseorang yang berkomentar menggunakan akun seperti Google,Open ID, AIM, TypePad, Wordpres, maupun LiveJournal. Dan yang berkomentar menggunakan URL/ Anonymous tetap gak akan bisa keluar avatar. Kali ini solcom akan membahas cara memberikan  avatar secara otomatis pada komentar  yang menggunakan URL ataupun  Anonymous. Oke sobat caranya seperti ini.

1.Login ke Dashboard.
2.Pilih tempalate ( rancangan ) >Edit HTML >Centang Exspand Template
   Widget.
3.Cari kode di bawah ini ( Untuk mempercepet gunakan Ctrl + F ).

<dl id='comments-block'> atau <dl class='comments-block' id='comments-block'>

4.Setelah ketemu ganti kode di atas  dengan kode di bawah ini.

<dl expr:class='data:post.avatarIndentClass' id='comments-block'>

5.Untuk selanjutnya cari kode di bawah ini.

<a expr:name='data:comment.anchorName'/>

6.Setelah ketemu tambahkan kode di bawah ini tepat di atasnya.

<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='35px' style='margin-bottom:-2px;' width='35px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>

7.Cari kode di bawah ini.

]]></b:skin>

8.Setelah ketemu tambahkan kode di bawah ini tepat di atasnya.

.avatar-image-container img {

background: url(http://i1270.photobucket.com/albums/jj616/parkwok/emoticon1-1-1-1.jpg) no-repeat;

width: 35px;

height: 35px;

}

Catatan : Untuk tulisan yang berwarna merah di atas boleh di ganti URL gambar sobat.
9. Untuk yang terakhir klik Simpan.

Oke sobat sampai di sini dulu tutorial dari solcom, jika ada yang kurang mengerti boleh bertanya.

Artikel Terkait: