How to Make Comment Form Under Post ~ LadyElen

Lady mau ngasih oleh2 dari blogwalking, jadi jalan2 tadi tidak hanya sekedar menyapa di SB teman yang sedang kita kunjungi, maupun memberi komentar di postingan yang kita kehendaki. Oleh2 yang didapat dari Pak AbiBakar ini cukup seru

Awalnya tertarik ngeklik judul posingan tentang kolom komentar di setiap postingan. Seru nih, serasa wordpress

Di Blogger jika ingin memberi komentar pada posting mengharuskan untuk membuka window baru. Hal ini kadang membuat malas untuk memberikan komentar meskipun ingin sekali mengomentari postingan blog tersebut. Lain halnya jika anda ngeblog pada wordpress, kendala seperti ini tidak akan anda jumpai. Karena layanan komentar rss mereka memudahkan pengunjung untuk memberi komentar pada window dan lembaran yang sama, tanpa harus membuka lembaran baru seperti pada Blogger.

Tips ini hanya bisa di aplikasikan pada Blogger beta dengan xml blogger template, artinya tidak bisa diterapkan pada classic template/ template klasik. Blog ini sudah mempraktekkan dan ternyata berhasil, bisa lihat bentuknya di bawah posting ini. Berminat?

Inilah 10 langkah untuk memasang kolom komentar di setiap posting Blogger:

1. Ke dashboard -> control panel -> edit html
2. Tick the Expand Widget Templates dicentang
3. Sebelum memulai back-up dulu html anda, dengan men-savenya jaga2 melakukan kesalahan dengan salah taruh kode
4. Kemudian temukan HTML kode dibawah ini:

<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>

<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>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<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>

<p class='comment-footer'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
</p>
</b:if>

<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>

5. Lantas ganti kode html diatas dengan kode dibawah ini:

<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>






<div id='comment-parent' style='padding-bottom: 20px;' onmouseover='showcomment("hoverme", "comment-child");'>
<h3 id='hoverme' style='display:block;'>
<img alt='Your cOmment"s Here! Hover Your cUrsOr to leave a cOmment.' src='http://lifewg.googlepages.com/html-code-leave-comment.gif' title='Your cOmment"s Here! Hover Your cUrsOr to leave a cOmment.'/>
</h3>


<div id="comment-child" style='border: none; display: none; height:750px; width: 420px; margin-bottom: 5px; background: #fff none; border: 1px solid #FCO;'>
<iframe style='border:none;' expr:src='data:post.addCommentUrl' height='100%' scrolling='yes' width='100%'/>
<br/>
</div>


</div>

</b:if>
<div id='backlinks-container'>
<div expr:id='data:widget.instanceId + "_backlinks-container"'>
<b:if cond='data:post.showBacklinks'>
<b:include data='post' name='backlinks'/>
</b:if>
</div>
</div>
</div>
</b:includable>

6. Kemudian copy semua html kode dibawah ini dan letakan diatas tag: </body>

<script languange='javascript'>function showcomment(a,b){var jackbookdotcom = document.getElementById(a);jackbookdotcom.style.display = 'none';jackbookdotcom = document.getElementById(b);jackbookdotcom.style.display = 'block';}</script>

7. Dan temukan kode html dibawah ini:

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>

<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

8. Gantilah dengan kode dibawah ini :

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != "item"'>

<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.url + "#comments"' ><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

Catatan: Jika template tidak ada ini . contohnya begini saja bentuknya:

<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>

maka tetap masukkan saja kode dilangkah no 8 diawali dari:
<b:if cond='data:blog.pageType != "item"'> sampai </b:if>

9. Lantas klik "Save Template".

10. Kemudian lihat blog, kalo langkahnya tepat pastinya sudah mempunyai sistem komentar dibawah setiap posting seperti pada Wordpress.

Langkah selanjutnya memodifikasi bentuk komentar. Ada 2 bentuk komentar yang bisa terapkan tergantung kebutuhan dan selera.

1. Pertama dengan bentuk menurun kebawah seperti pada blog ini, bisa lihat dibawah posting ini.
caranya: --> Setting --> Comments --> Show comments in a popup window? Klik 'YES'.

2. Atau dengan bentuk menyamping.
caranya: --> Setting --> Comments --> Show comments in a popup window? Klik 'No'.

Selamat mencoba

tautan:
http://www.jackbook.com/2007/06/how-to-make-readers-leave-comment.html
http://abibakar.blogspot.com/2007/08/kolom-komentar-disetiap-posting-blogger.html