Different Styles for Author Comments

4xmo mukadimah panjang2x..
kali ni tuts kita iaitu nak buat different styles utk author comments

Mula2x anda harus pastikan yg comment blog anda dah pun di setkan "Show Comment"
bagaimana nak set???

• Setting
• Comment
• "Show" Comment

*igt sebelum membuat apa-apa perubahan anda di minta buat backup template.

lets tuts begin.............

• Layout
• Edit HTML
• Click pada kotak Expand Widget Template
• ctrl+f untuk mencari perkataan "comments-block".
• Selepas dah jumpa sila paste kan code yg telah di bold dan berwarna merah
  

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt class='comment-author' expr:id='"comment-" + data:comment.id'>
<a expr:name='"comment-" + data:comment.id'/>
<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>

<b:if cond='data:comment.author == data:post.author'>
<dd class='blog-author-comment'>
<p><data:comment.body/></p>
</dd>
<b:else/>

<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>

</b:if>

<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='"#comment-" + data:comment.id' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

bila sudah selesai paste code seperti di atas
kita teruskan dgn buat style nya lak..

ctrl+f utk mencari perkataan "comment-body"

#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}

kemudian lepas dah jumpa..kita paste kan code yg bold +merah seperti di bawah:-

#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
.blog-author-comment {
margin:.25em 0 0
}
.blog-author-comment p {
margin:0 0 .75em;
paddinrg:5opx 10lpx;
bordcer:1px dotted #254117;
color:#000000;
background:#e56e94;
}

jika anda lihat ada padding kan..ianya adalah space around the text arr..5px utk atas dan bawah..
10px lak utk kiri dan kanan..jika xmahu ada background pun ok je..boleh buang..color tu adalah utk color utk font tulisan author..yg ni lah yg boleh kita bezakan..untuk membuat pilihan warna berserta codenya boleh la ke sini



cth yg telah di buat..


**entry ni di buat setelah di minta oleh Kak Reena yg comel..
(bukan bodek k..mmg kenyataan dia comel!!! xcaya p terjah arr blog dia)


Selamat Mencuba!!!


mood: