Tutorial: Cantikkan Kotak Komen / Decorate your Comment Box (Blogskin)

Assalamualaikum

You want a comment box like this? Keep reading! ;)

[Only work on Blogskin]

First, paste these code BEFORE </style> (Doesn't matter which one.)

.comment-timestamp { margin:0 0 .5em; padding:0 0 .75em 20px; color:#666; } .deleted-comment { font-style:italic; color:gray; } #comments { margin:5; border-width:0 1px 1px; padding:20px 0 15px 0; } .comment-icon blogger-comment-icon{display:none} #comments-block { margin:2px ; } .comment-data { background:url("http://media.tumblr.com/tumblr_m89rmpKOEf1qdlkyg.gif") no-repeat 2px .3em; margin-top:5px !important;background-size:10px; padding:0 0 0 20px; color:#666; } span.comment-icon{display:none} .comment-poster { font-weight:bold; } .comment-body { margin:0px; } .comment-body p { background:#FFFFFF; border:3px solid #FCEBED; margin:0em; padding:5px; color:#808080; }

Then search for </Blogger> and paste the codes BEFORE it.

<itempage> <div id="comments" style="margin-top:5px;"> <blogitemcommentsenabled><a name="comments"></a> <dl id="comments-block"> <div style="width:470px; padding:5px;margin-top:20px;border:4px solid #fff;6px;background:url(http://pastelpatterns.com/small/smallpattern-9.png); box-shadow:0 0 3px #ddd;"> <$CommentPager$> <blogitemcomments> <dt class="comment-data" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a> <$I18NCommentAuthorSaid$></dt> <dd class="comment-body"> <p> <$BlogCommentBody$></p> <$BlogCommentDeleteIcon$> </dd> </BlogItemComments> <$CommentPager$> </dl> </div> <p class="comment-timestamp"> <$BlogItemCreate$> </p> </div> </ItemPage>

After that, you need to search for another </Blogger> tag  (most blogskins have two entry codes due to pagination system), and paste the codes BEFORE it again.

Oh yeah, please remove the original code first, okay? ;) So that it won't overlap.

p/s: Live preview the picture above, click HERE. Second blogskin on the way! =D

Credit: Kak Wana