Cara Memberi Avatar pada Komentar Anonymous dan Name/URL

Cara Memberi Avatar pada Komentar Anonymous dan Name/URL - Cara memasang avatar otomatis pada komentar anonymous dan name/URL atau cara memberi avatar pada komentar anonymous dan name/url  atau cara mengganti avatar otomatis pada komentar anonymous dan name/url.

Setelah posting sebelumnya dengan judul cara menyembunyikan navbar blog, kali ini saya akan mengulas tutorial cara memasang avatar otomatis pada komentar anonymous dan name/url. Pada template default blogspot avatar pada komentar hanya ada jika kita ber komentar login sebagai account google dan sebagainya, jika kita berkomentar anonymous ataupun name/url maka avatar atau gambar pada komentar tidak ada alias kosong. Dan biasanya tampilan yang kosong terlihat kurang menarik, oleh karena itu perlu diedit sehingga tampil lebih bagus. Langsung saja cara pasang avatar otomatis pada komentar anonymous dan name/url:
1. Pastikan Tampilkan gambar profil dalam komentar diaktifkan.
2. Klik Template >> Edit HTML >> Lanjutkan (jangan lupa centang Expand Template Widget) >> cari dan pastikan kode berikut ini ada di blog sobat:

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

3. Jika kode di atas ada, maka selanjutnya cari kode ]]></b:skin> letakkan kode berikut ini tepat diatas kode ]]></b:skin>

#comments-block .avatar-image-container img {  
background: #fff url(https://lh6.googleusercontent.com/-H6zAH-hO5lg/Tibog_Gg8qI/AAAAAAAAAYQ/QYvJ4OkVUm8/default-avatar-profile.png) no-repeat left top;
width:32px;
height:32px;

Save template dan lihat hasilnya.

>> Jika kode <dl expr:class='data:post.avatarIndentClass' id='comments-block'>  tidak ada, maka cari kode <dl id='comments-block'> ganti dengan kode:

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

>> Kemudian cari <a expr:name='data:comment.anchorName'/> ganti dengan kode di bawah 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>

>> Kemudian selanjutnya cari kode ]]></b:skin> letakkan kode berikut ini tepat diatas kode ]]></b:skin>

#comments-block .avatar-image-container img {
background: #fff url(https://lh6.googleusercontent.com/-H6zAH-hO5lg/Tibog_Gg8qI/AAAAAAAAAYQ/QYvJ4OkVUm8/default-avatar-profile.png) no-repeat left top;
width:32px;
height:32px;

Kode di atas adalah avatar yang menggunakan gambar dengan url: https://lh6.googleusercontent.com/-H6zAH-hO5lg/Tibog_Gg8qI/AAAAAAAAAYQ/QYvJ4OkVUm8/default-avatar-profile.png

Sobat bila mengubahnya dengan gambar lain jika diperlukan.

>> Save template dan lihat hasilnya.

Nah, sekian tutorial mengenai cara memberi avatar pada komentar anonymous dan name/url. Semoga bermanfaat.