08 February 2012

Tutorial : Cantikkan Kotak Komen Korang

Photobucket

Macam biasa pergi ke Dashbord > Design > edit HTML ( tick expand widget templates )
and carikk code nie :

/* Comments

Nanti korang akan nampak ank-ank coding die ... Korang just delete semua code tu dan gantikan dengan code bawah nie :

#comments h4 {
margin: 1em 3em;
font-weight: bold;
line-height: 1.4em;
color: #ffffff;
}
#comments-block {
margin-left:1.5em;
line-height:1.6em;
background: transparent;
color: black;
padding: 1em;
border:0px solid #ffffff;
}
#comments-block .comment-author {margin:.5em 0;}
#comments-block .comment-body {margin:.25em 0 0; background: #ffffff;}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .60em;
padding: 5px 5px 5px 5px;
background: url(URL IMAGE BACKGROUND) repeat top left;
-moz-border-radius: 20px 20px / 20px 20px;
border-radius: 5px 5px / 5px 5px;
border: 2px solid #F97E7E;
}
.deleted-comment {
font-style:underlined;
color:transparent;
}
.feed-links {
clear: both;
line-height: 2.5em;
}
#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
#blog-pager {
text-align: center;
}



Nota kecil :

UNGU : Background kotak komen
BIRU : Warna border

Tutorial : Icon dalam Comment Box

Photobucket

Firstly , korang kena pergi ke Dashboard > Design > Edit HTML ( tick expand widget templates )
and carikk code nie :

data:comment.authorUrl

Jumpaa ? Kemudian korang gantikan code bawah nie & paste lahh kayy ...

<b:if cond='data:comment.authorUrl'>&lt;img src=&quot;IMAGE URL KORUNK&quot;/&gt;
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>

Done :) Oops , terlupa lak nk ckp yang tuto nie untuk sebelah comment author :):)

Tuto nie untuk sebelah date pulak ... Follow step nie betul-betul supaya korang tak payah tanya Nisa ...

Ok , serch code nie dulu :

<dd class='comment-footer'>
<dd class='comment-footer'> &lt;img src=&quot;IMAGE URL KORUNK&quot;/&gt; <span class='comment-timestamp'> <a expr:href='data:comment.url' title='comment permalink'> <data:comment.timestamp/> </a>

Okay now Save darlings ...


Nota Kecil :

MERAH : Url gambar yang korang nk letak ...

 
Copyright© All Rights Reserved by Khairunnisa Hassan