Solusi untuk mengatasi masalah ini adalah dengan cara menambahkan elemen pembungkus baru yang digunakan untuk mengelilingi formulir dan pesan formulir komentar. Sehingga, kita tidak lagi menugaskan .insertBefore() untuk mengangkat elemen replybox tapi kita akan membuat .insertBefore() mengangkat elemen pembungkusnya, sehingga formulir komentar dan pesan formulir komentar di dalamnya akan ikut terbawa ke mana saja elemen pembungkus berpindah. Caranya sebagai berikut :
1. Edit HTML, kemudian tag Expand Template Widget
2. Cari kode dibawah :
<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>
Tekan CTRL + F lalu cari kode <b:includable id='threaded-comment-form' var='post'> untuk mempermudah pencarian
3. Kalau sudah ketemu, ganti semua dengan kode dibawah :
<b:includable id='threaded-comment-form' var='post'>
<div class='comment-form'>
<a name='comment-form'/>
<b:if cond='data:mobile'>
<div id='form-wrapper'>
<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%'/>
</div>
<b:else/>
<div id='form-wrapper'>
<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%'/>
</div>
</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>
Nah pada kode diatas bahwa elemen <iframe> dan <p><data:blogCommentMessage/></p> telah dikelilingi dengan elemen<div id='form-wrapper'>. Artinya, di dalam #form-wrapper terdapat formulir komentar dan pesan formulir komentar. Nah, sekarang kita tinggal membuat .insertBefore() untuk mengangkat #form-wrapper
4. Terakhir cari kode ini
document.getElementById(domId).insertBefore(replybox, null);
5. Ganti dengan kode
document.getElementById(domId).insertBefore(document.getElementById('form-wrapper'), null);
6. Simpan Template.
Sekarang setiap kali kita mengklik tombol Balas atau poskan komentar, maka yang akan berpindah-pindah adalah elemen #form-wrapper dan bukan elemen #comment-editor. #comment-editor dan pesan formulir komentar di dalamnya hanya akan berdiam diri di dalam #form-wrapper dan akan mengikuti ke mana saja dia berpindah. Semoga bermanfaat…
Silahkan anda kembali ke sini untuk mengikuti cara pembuatannya,atau untuk lebih jelasnya silahkan ikuti sumbernya di bawah
-->Perhatian<--
Di larang Nyepam