[Tutorial] Cute Comment Box

Assalammualaikum :) Some people ask me, cemana nak buat comment box selepas entry tu kat dalam blogskin template. Because in my Main Blog, saya gunakan blogskin template *created and own by me* yang mana comment box appeared selepas entry. Haihh. Membebel panjang pun tak guna kalau tak paham. So, camnie contohnya :

1. Pegi Settings > Comment > Tick embedded below the post. Takde lagi pop up window.

2. Next, pegi edit template korang and search code nie :

</style>

3. Copy & paste code bawah ini sebelum </style>

/* Comments
----------------------------------------------- */
#comments h4 {margin:1.8em 0; font-size:10px; text-transform:uppercase; color: #aaaaaa; line-height:10px; border-bottom: 1px dashed #dedede; background: ; font-weight:normal;}
#comments h4 strong {font-size:8pt tahoma;}
#comments-block {background: ; font:normal 8pt arial; line-height:1.2em; padding:4px;}
#comments-block dt { margin:.5em 0;}
#comments-block dd { margin:.25em 0 0;}
#comments-block dd.comment-timestamp {margin:-.25em 0 2em; font:5pt tahoma; text-align:right; text-transform:normal; letter-spacing:.0em;}
#comments-block dd p {margin:0 0 .75em; padding:4px; background:#fff1f3; border:1px solid #dedede; border-radius:2px;}
.deleted-comment { font-style:italic; color:gray;}
.paging-control-container { float: right; margin: 0px 0px 0px 0px; font-size: 80%;}
.unneeded-paging-control { visibility: hidden;}

4. Then, cari code ini <$BlogItemBody$>

5. Gantikan code <$BlogItemBody$> dengan code di bawah ni :

<$BlogItemBody$>
<center><br><MainPage>
<BlogItemCommentsEnabled>
<BlogItemCommentsEnabled><a href="<$BlogItemCommentCreate$>"
<$BlogItemCommentFormOnClick$>> <$BlogItemCommentCount$>
comment (s) </a> | <a href="<$BlogItemCommentCreate$>" <$BlogItemCommentFormOnClick$>>Jom comment (s) </a>
</BlogItemCommentsEnabled>
</BlogItemCommentsEnabled>
</MainPage>
<br>
<div style="text-align:right;" ">
<!-- Begin #comments -->
<ItemPage>
<div id="comments">
<BlogItemCommentsEnabled><a name="comments"></a>
<h4><$I18NNumComments$>:</h4>
<dl id="comments-block">
<$CommentPager$>
<BlogItemComments>
<dt class="comment-poster" id="<$BlogCommentAnchorName$>"><a name="<$BlogCommentAnchorName$>"></a>
<$I18NCommentAuthorSaid$>
</dt>
<dd class="comment-body">
<p><$BlogCommentBody$></p>
</dd>
<dd class="comment-timestamp"><a href="<$BlogCommentPermalinkURL$>" title="comment permalink"><$BlogCommentDateTime$></a>
<$BlogCommentDeleteIcon$>
</dd>
</BlogItemComments>
<$CommentPager$>
</dl>
<p class="comment-timestamp">
<$BlogItemCreate$>
</p>
<p class="comment-timestamp">
</p>
</div>
</ItemPage>
<!-- End #comments -->

6. Kalau ada dua <$BlogItemBody$> gantikan dua-2 sekali.

[Tutorial] Enable Comment Form

Ada sesetengah template blogskin, dia punya comment link tak berfungsi. So, bagi mengatasi masalah ini, kita haruslah mengikut langkah-langkah atau inisiatif-inisiatif seperti di bawah \ayat karangan BM SPM. luls XD/

1. Dashboard > Template
2. Ctrl + F, search for this code :

<$BlogItemBody$>

3. Copy and paste this code AFTER code <$BlogItemBody$>

<center><a href="<$BlogItemCommentCreate$>"<$BlogItemCommentFormOnClick$>> <span style="font-size: 7.5pt; background-color:#ffffff; padding: 4px; text-transform: uppercase;"><$BlogItemCommentCount$> Comment(s) </span></a></BlogItemCommentsEnabled>

#yang merah tu boleh tukar kalau nak. ##kalau korang dah ada code nie, sila skip step ni. Just proceed to the next step.
4. Then, korang pegi ke Setting > Comments > Comment Form Placement > Tick Pop-up window

Save dan lihat hasilnya :D
Update
Kalau korang malas nak buat kerja banyak2 kali, korang boleh guna cara kat bawah nie untuk buat comment box tu berfungsi.
1. Dashboard > Template
2. Ctrl + F, search for this code :

</blogger>

3. Jumpa? Copy this code and paste BEFORE </blogger>

<BlogItemCommentsEnabled><a class="comments" href="https://www.blogger.com/comment.g?blogID=YOUR BLOG ID&postID=<$BlogItemNumber$>&isPopup=true" onclick="window.open('https://www.blogger.com/comment.g?blogID=YOUR BLOG ID&postID=<$BlogItemNumber$>&isPopup=true', 'bloggerPopup', 'toolbar=0,scrollbars=1,location=0,statusbar=1,menubar=0,resizable=1,width=250,height=360');return false;"><$BlogItemCommentCount$> comment(s)</a></BlogItemCommentsEnabled> 

#yang merah tu tukar dengan blog ID korang. Tak tau nak amek kat mane? Tengok kat SINI. #yang biru boleh tukar dengan ayat korang.
Lots of Love Yana♥