Tutorial Cantikkan Kotak Komen

555975_528121200559421_543063882_n_large
Hye...
iema nax tunjukkan cara untuk cantikkan kotak komen macam kat blog iema
jom follow tutorial nie k ^^

 P/S : nax copy, highlight dan guna ctrl + c

 Dashboard -> Templates -> Edit HTML -> tick Expand Widget Template
 ctrl + f, cari kod nie
<b:loop values='data:post.comments' var='comment'>
 dan yang nie jugax
</b:loop>
 korang akan jumpe keseluruhan macam nie
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + 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' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>
<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>
 selain kod merah toe korang delete dan gantikan dengan kod nie
 <div expr:class='&quot;author-comment &quot; + data:comment.authorClass'>
<dt class='comment-author' 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' expr:id='data:widget.instanceId + data:comment.cmtBodyIdPostfix'>              <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 class='comment-reply'><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=6704232620769776681&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=400,height=450&quot;); return false;'><img alt='Reply To This Comment'/> </a>
</span>
</span>
</dd>
</div>
 ctrl + f, cari kod nie pulax
]]></b:skin> 
 copy dan paste kod nie di atas kod tadi
.comment-footer{
margin-bottom:0 !important;
}
.author-comment{
background : #FFFFFF url(url image untuk kawan) no-repeat right top;
padding:5px;
margin-bottom:1.5em;
border:3px solid #A31947;
border-radius:10px;
}
.author-comment.blog-author {
background: #FFFFFF url(url image untuk owner blog) no-repeat right top;
padding:5px;
margin-bottom:1.5em;
border:3px solid #FF5CAD;
border-radius:10px;
}
* color oren = untuk background komen kawan korang
* color kuning = untuk background komen korang
* color ungu = border untuk komen kawan korang
* color biru = border untuk komen korang

 dah siap, korang preview dulu...
tak ade pape error, boleh la save

selamat mencuba 

15 comments:

keqraaaaaaswift said...

Asal tak boleh nak copy pun ?

Iema Gurlz said...

@keqraaaaaaswift tax boleh copy yg mcm mne?

Iema Gurlz said...

@keqraaaaaaswift oo.. k2 paham..
kalau nx copy, highlight kod toe dan guna ctrl + c kat keyboard

mailey jayley said...

iema , kalo url image tue tak letak pun boleh ke ??

Iema Gurlz said...

@mailey jayley boleh... kosong kan je kalo tax nax letax..
padam tulisan hijau toe ^^

Miz Tia said...

kak iema saya boleh minta emoticon chatboxnya ya.. cantik cantik


oya kalo kita mau pake cuma untuk owner blog diatas berarti kode untuk temen dihapus ya.

Iema Gurlz said...

@Miz Tia boleh... amex la...
kod teman yg mne ye ?
x pham.. sowie... huhu ^^

Miz Tia said...

@Iema Gurlz terima kasih ya..

itu bikin berat blog gak ya.

Iema Gurlz said...

@Miz Tia ye ke??
iema gne ok je ^^

azi kosasih azi said...

ko tidak jadi kk ? knp

azi kosasih azi said...

ko tidak jadi ka -___-"

azi kosasih azi said...

ko tidak jadi ka macam mne -___-"