Menampilkan foto di kotak komentar

Yah, sudah lama gak posting artikel yah. Aku sudah lama banget gak terjun di dunia blog, khususnya di egablogspot ini. Dan ini yang membuat aku menjadi kangen banget dengan blog. hehehehe

Ayo kita pelajari lagi tentang blog tutorial!! Materi kali ini berhubungan dengan komentar. Yak, untuk membuat komentar kita semakin hidup, perlu di tambahkan foto di kotak komentar. Kita akan buat 3 Step.

1. Mengaktifkan settingan foto di kotak komentar

Login ke blogger
Masuk Ke menu Pengaturan
kemudian pilih yang komentar
Lihat di bagian bawah, "Tampilkan gambar profil dalam komentar?". Silahkan Pilih ya

2. Menampilkan Foto di kotak komentar (foto profil)

Masuk ke tata letak
Kemudian pilih Edit HTML
Centang kotak kecil
Lalu, cari kode:

<dl id='comments-block'>

Jika sudah ketemu, hapus kode di atas. Ganti dengan kode ini:

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

Kemudian cari lagi kode ini:

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

Letakan kode di bawah ini, di bawah kode di atas:

<b:if cond='data:blog.enabledCommentProfileImages'>
<data:comment.authorAvatarImage/>
</b:if>

3. Menampilkan foto non profil (Name/url)

Masuk ke Tata letak
pilih Edit HTML
Centang kota kecil
cari kode:

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

Ganti kode tersebut dengan kode:

<b:if cond='data:comment.favicon'>

<img expr:src='data:comment.favicon' height='35px' style='margin-bottom:-2px;' width='35px'/>

</b:if>

Kemudian, taruh kode di bawah ini, di atas kode ]]></b:skin>

/* Avatar */
.avatar-image-container img {
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJFdFHqX2Nf34XBa_kkDPaH52N309KxavlrmgAAqKiOuG5m7G_yVKeRFnoLBjTRHcbkLXrZhtNvd59REc8Ql6I280yLM2RUj-twBtYBLgdNvvg3LpWzEIoVeenyLeoPkmNel-CdnSCOQMm/s320/AvatarBlogger.png);
width:35px;
height:35px;
}

Selesai