Comment Box New Style

Hey Peeps!

Malam ni dila nak ajarkan kat korang...comment box new style...jarang dila dapat lihat comment

box yang camni kat mana-mana blog...even blog dila sendiri takde comment box camni...so...takpayah lah

korang susah payah duk mengintai comment box dila..memang tak sama langsung dengan yang baru ni...

but korang jangan risau...dila akan tunjukkan contoh..comment box yang dila maksudkan ni....

* Lee Min Ho menggatai dengan saya...jangan jelly..hehehe

*buat muka blur........

Oke! yang baru nyer korang perasan tak kat comment box tu ada "Peminat Dieyla" and "Balas Surat

Peminat"....so dila nak ajar korang biar comment box korang jadi camni lah...cun kan....oke..cara nak

mengeditnyer mungkin sulit sikit *bagi dila...tapi tak pew korang cuba dulu yew...dila pun dah cuba buat..

tengok lah hasilnya * tapi dah tukar kepada asal..tak minat..hui..hui...  

1.  Log in > Dashboard > Design > Edit HTML 
2. Tick expand widget
3. Tekan ctrl + F dan search code ni  <b:loop values='data:post.comments' var='comment'
4. Bawah code tadi ada code ni

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

5. Korang hightlight kesemua code yang berwarna purple

Warna merah jangan hightlight

6. Delete code yang dihightlight dan gantikan dengan code ni

<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>            </dd>          </div>

7. Search Code ni plak  ]]></b:skin>

8.Copy code bawah ni dan pastekan kat atas code tadi

.comment-footer{margin-bottom:0 !important;}.author-comment{background : #FFFFFF url(URL GAMBAR KAWAN OWNER)no-repeat right top ;padding:5px;margin-bottom:1.5em;border:2px solid #000000;border-radius:10px;}.author-comment.blog-author {background: #D8D8D8url(URL GAMBAR OWNER)no-repeat right top;}

Selesaikan Teka-Teki Di Atas :
Merah : Warna Background Kawan OwnerGreen : Url Gambar Kawan OwnerLight Green :Ketebalab Border Kotak KomenLight Blue : Jenis BorderDark Blue : Warna BorderPurple : Warna Background OwnerPink : Url Gambar Owner

Freebies Gambar Owner dan Kawan Owner

http://i.imgur.com/YbjDI.png

http://i.imgur.com/ZDRNf.png

warna search Kat Sini

---

Tengs For Read

---