View Avatar Pada Blogger Comment
Kali nie kite akan belajar cara2 memasukkan avatar pada Blogger Comments. bagi yang menggunakan default template mungkin agak mudah dan mungkin telah disediakan, tetapi untuk tutorial ini khusus untuk sesiapa yang buat template sendiri atau upload file xml sendiri.
1. Pergi ke Blogger > Setting > Comments dan enable "Show profile images on comment" kemudian "Save Setting"
(klik untuk besarkan)
(Klik untuk besarkan)
Kalo korang pakai normal template...korang dah bleh nampak avatar di comment blog, tapi kalo korang buat template sendiri, korang kene tambah skit code la..x banyak...skit je...hehehe...tapi sebelom tu korang kene backup dulu template tu kalo apa2 terjadi sape nak tanggung plak..ekeke..
2. Pergi ke Blogger Layout > Edit HTML > tipkan "widget templates"
(klik untuk besarkan)
Cari code ini
sekiranya tiada cari code ini
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<dl id='comments-block'>
3. Gantikan code tadi dengan
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
(klik untuk besarkan)
4. Kemudian cari code ini
<a expr:name='data:comment.anchorName'/>
(klik untuk besarkan)
5. Gantikan dengan code ini
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</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>
(klik untuk besarkan)
Jika anda ingin letak default avatar bagi sesiapa yang tiada profile gambar cuma tambah sedikit CSS.
6. Cari code ini
]]></b:skin>
(klik untuk besarkan)
7. gantikan dengan code dibawah ini:
.avatar-image-container
{background:url(http://2.bp.blogspot.com/_u4gySN2ZgqE/SrTInZfKwVI/AAAAAAAAAwA/xaGlRIqkHDw/s400/default.gif);width:35px;height:35px; }
.avatar-image-container img { border:none;}
]]></b:skin>
(klik untuk besarkan)
Ok sekarang di comment blog anda akan terdapat avatar bagi sesiapa yang comment page anda...harap tutorial ini berguna.
1 comments:
SEKIRANYA korang ade tips lain bleh share kat sini...
Post a Comment