Awalnya saya iseng-iseng aja mencari akal untuk mencari CSS kotak komentar ini untuk dipergunakannya diblog ini, mulai search di Page Sourch sampai di Google, dan akhirnya ketemu juga CSS-nya. Menurut filosofi saya pribadi, kegunaannya mungkin untuk memperindah tampilan editor komentar atau mengisi slot yang kosong pada editor komentar.
Bagi Pengguna Threaded Comment Hack
Silahkan cari kode pada daerah <b:includable id='comments' var='post'>
<div class='comment_form'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<div class='comment_emo_list'/>
<b:include data='post' name='threaded-comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' expr:title='data:postCommentMsg'><data:postCommentMsg/></a>
</b:if>
</b:if>
</div>
</b:if>
</div>
Lalu tambahkan kode dibawah ini
<div style='float:right;margin-top:-54px;margin-right:7px;padding:7px 10px;border:1px solid #ddd;border-radius:2px;'>Terima kasih atas komentar Anda</div>
Kata Terima kasih atas komentar Anda bisa disesuaikan dengan keinginan sendiri, maka penempatan CSS-nya akan seperti ini
<div class='comment_form'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<div class='comment_emo_list'/>
<b:include data='post' name='threaded-comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' expr:title='data:postCommentMsg'><data:postCommentMsg/></a>
</b:if>
</b:if>
<div style='float:right;margin-top:-54px;margin-right:7px;padding:7px 10px;border:1px solid #ddd;border-radius:2px;'>Terima kasih atas komentar Anda</div> </div>
</b:if>
</div>
Silahkan atur pada margin-top jika kotaknya terlalu ke atas, atau margin-right jika kotaknya terlalu ke kanan. Terakhir silahkan SAVE templatenya.
Bagi Pengguna Threaded Comment Blogger Biasa
Silahkan temui kode seperti dibawah ini
<b:includable id='threaded-comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
<b:else/>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
</script>
</div>
</b:includable>
Next, tambah kode ucapan terima kasihnya diatas kode </div> paling bawah, jadi seperti kode di bawah ini
<b:includable id='threaded-comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
<b:else/>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
</script>
<div style='float:right;margin-top:-54px;margin-right:7px;padding:7px 10px;border:1px solid #ddd;border-radius:2px;'>Terima kasih atas komentar Anda</div> </div>
</b:includable>
Kemudian cari kode seperti dibawah ini
<b:includable id='comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<h4 id='comment-post-message'>
<a expr:id='data:widget.instanceId + "_comment-editor-toggle-link"' href='javascript:void(0)'><data:postCommentMsg/></a></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
<b:else/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
</script>
</div>
</b:includable>
Sama seperti di atas tambahkan kode ucapan terima kasihnya di atas kode </div> paling bawah sehingga peempatannya seperti di bawah ini.
<b:includable id='comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<h4 id='comment-post-message'>
<a expr:id='data:widget.instanceId + "_comment-editor-toggle-link"' href='javascript:void(0)'><data:postCommentMsg/></a></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>
<b:else/>
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
<p><data:blogCommentMessage/></p>
<data:blogTeamBlogMessage/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/>
</b:if>
<data:post.friendConnectJs/>
<data:post.cmtfpIframe/>
<script type='text/javascript'>
BLOG_CMT_createIframe('<data:post.appRpcRelayPath/>', '<data:post.communityId/>');
</script>
<div style='float:right;margin-top:-45px;margin-right:7px;padding:7px 10px;border:1px solid #ddd;border-radius:2px;'>Terima kasih atas komentar Anda</div> </div>
</b:includable>
Terakhir, SAVE template..
Semoga bermanfaat...
3 Komentar
mas di blog saya gak muncul. solusinya mas??
saya pakai template Droidpluss juga mas.
Buktinya saya berhasil, coba diacak-acak lagi posisinya..
Kalau bingung, bisa pakai aja css ini:
.thanks {
font-family:Arial, sans-serif;
font-size:12px;
right:7px;
margin-top:-67px;
padding:6px 12px;
background:#f8f8f8;color:#999;
border:1px solid #c9cacb;
border-radius:3px;
position:absolute;
}
Dan kode HTML nya ini :
<div class='thanks'>...</div>
terima kasih banyak mas udah muncul sekarang :)
BERI KOMENTAR | KHUSUS PENGGUNA TERDAFTAR
Silahkan beri komentar Anda dengan bijak dan sesuai dengan topik (untuk komentar OOT sebaiknya di Forum Ngopi).