Tentu ramai diantara anda yang sudah mengetahui tentang feature terbaru yang ada di blogger.Sebelum ini blogger baru sahaja menambah fungsi read more kini mereka telah menambah lagi fungsi yang baru di blog blogspot iaitu Avatar pemberi komen.Nampaknya blogger telah sedikit sebanyak membuat improve kepada blogspot sempena birthday blogger dan aku mengharapkan agar blogger dapat menambah berbagai-bagai lagi fungsi yang berguna kepada blogspot seperti thread comment dan sebagainya.Sila pergi ke bloggerbuzz untuk mengetahui dengan lebih lanjut.
Jika sebelum ini aku ada menunjukkan bagaimana cara untuk menampilkan avatar dari mybloglog sila rujuk sini pada kali ini aku akan tunjukkan bagaimana cara untuk menampilkan avatar dari blogger.Sesetengah template memang sudah sedia ada fungsi Avatar ini tetapi kepada sesetengah template mungkin tiada jadi anda perlu membuat sedikit penambahan kode untuk menampilkan Avatar itu.Sila rujuk dibawah untuk keterangan lanjut.
1.Pergi ke Dashboard--->layout---->Edit HTML.
2.kemudian cari kode </b:skin> tekan CTR+F jika menggunakan firefox.
setelah itu pastekan kode dibawah ini diatas kode yang anda cari tadi
#comments-block .avatar-image-container img {
background:transparent url(http://tinyurl.com/yahswtb) no-repeat scroll left top;
border:medium none;
float:left;
height:45px;
width:45px;
}
#comments-block .avatar-image-container.avatar-stock img {
border-width:0;
padding:1px
}
#comments-block .avatar-image-container {
background:transparent url(http://tinyurl.com/yahswtb) no-repeat scroll left top;
height:45px;
left:-45px;
position:absolute;
width:45px
}
#comments-block.avatar-comment-indent{
margin-left:45px;
position:relative
}
#comments-block.avatar-comment-indent dd {
margin-left:0
}
iframe.avatar-hovercard-iframe{
border:0 none;
padding:0;
width:25em;
height:9.4em;
margin:.5em
}
Sila savekan setelah siap.background:transparent url(http://tinyurl.com/yahswtb) no-repeat scroll left top;
border:medium none;
float:left;
height:45px;
width:45px;
}
#comments-block .avatar-image-container.avatar-stock img {
border-width:0;
padding:1px
}
#comments-block .avatar-image-container {
background:transparent url(http://tinyurl.com/yahswtb) no-repeat scroll left top;
height:45px;
left:-45px;
position:absolute;
width:45px
}
#comments-block.avatar-comment-indent{
margin-left:45px;
position:relative
}
#comments-block.avatar-comment-indent dd {
margin-left:0
}
iframe.avatar-hovercard-iframe{
border:0 none;
padding:0;
width:25em;
height:9.4em;
margin:.5em
}
3.Kemudian anda cari kode dibawah ini pula sila berikan tanda didalam kotak expand widget template.
Kode dibawah ini hanya separuh cari kode ini sehingga habis.
<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
……………………………………………………………………….
</b:loop>
</dl>
Setelah jumpa anda gantikan semua kode diatas itu dengan kode dibawah ini.<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<a expr:name='data:comment.anchorName'/>
……………………………………………………………………….
</b:loop>
</dl>
<dl expr:class='data:post.avatarIndentClass' id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<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'>
<data:comment.authorAvatarImage/>
</b:if>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
Kemudian klik save.Selesai semoga berjaya.<b:loop values='data:post.comments' var='comment'>
<dt expr:class='"comment-author " + data:comment.authorClass' expr:id='data:comment.anchorName'>
<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'>
<data:comment.authorAvatarImage/>
</b:if>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>
Credit To Blogspottutorial.
wohuu. perlu buat ni. hehe. bru nmpk skt mke ko yg hensem. haha =P
ReplyDeleteAcap mesti buat jangan x buat ye..Erkk ni puji ke ni rasa cam nk bg je adik aku dkt ko haha =))
ReplyDeleteade adik ye??. haha. :D. mesti r wt. aku test jap
ReplyDeletehoho. wei bro code yg bawah tu error. nk kene decode lu code tu. bru leh. aku test sudah. lagi satu pas siap. tukr nofollow jadi dofollow blk. hahaha =P
ReplyDeletealahai.. malasnya nak mengedit kode.. tp nak cuba buat gak la nnt..
ReplyDeletetryla ezany baru beast hehe
ReplyDeleteye ke acap tapi aku try ok jer nantila aku tgk blk
ReplyDeletecun jgk bro..blog aku ley pakai ke?hehe
ReplyDeletecun jgk boh..blog kawe bulih pakai x?
ReplyDeletezizav boleh jah semua blog boleh cuma kena masukkan kode tu jah
ReplyDeleteada try buat ariey tp x jadik, nanti try semula...
ReplyDeleteNape x jd plak daus..mgkn salah masuk kode kot tgkla semula
ReplyDeletekalau nak letak avatar tu belah kanan, kene tukar sume left kepada right ke?
ReplyDeleteAah Naddy cubala dulu kalau x blh ckpla
ReplyDeletetakut berat blog nanti .. ha !
ReplyDeleteeldy blog xkan jd berat sbb xde melibatkan javascript pun..lgpun avatar ni mmg dh disediakan oleh blogger cuma sesetengah template kita kena tambah kode
ReplyDeleteTerima kasih bwanget... atas Infonya....:D:D:D:D:D:D:D:D
ReplyDelete