• Twitter
  • Facebook
  • Google+
  • Instagram
  • Youtube

Tuesday, July 2, 2013

Cara Agar Pesan Komentar Selalu diatas Form Komentar



                Pesan komentar adalah sebuah pesan pendek yang biasanya berisi tentang aturan-aturan berkomentar di suatu blog. Seharusnya, pesan komentar tersebut berada di atas form komentar. Namun pada threaded comment dan beberapa keadaan tertentu, pesan komentar tersebut tidak berada di tempatnya. Terkadang pesan komentar tersebut berada dibawah form komentar. Hal ini membuat isi dari pesan komentar tersebut tidak selalu terbaca oleh pengunjung yang ingin berkomentar.

                Pada threaded comment atau komentar berbalas, ketika kita akan melakukan reply komentar maka form komentar itu akan berpindah berada tepat di bawah komentar yang akan kita balas komentarnya. Hal itu terjadi karena variable replybox yang memanggil form komentar tersebut kebawah komentar. Secara default, variable replybox tersebut hanya memanggil form komentar nya saja. Sedangkan pesan komentar nya tidak ikut terbawa karena form komentar dan pesan komentar nya adalah elemen yang berbeda. Itulah penyebab mengapa pesan komentar nya terkadang berada di bawah.
                Variable replybox secara default:

var onReply = function(commentId, domId) {
    if (replybox == null) {
        // lazily cache replybox, and adjust to suit this style:
        replybox = document.getElementById('comment-editor');
        if (replybox != null) {
            replybox.height = '250px';
            replybox.style.display = 'block';
            replyUrlParts = replybox.src.split('#');
        }
    }
    if (replybox && (commentId !== replyParent)) {
        document.getElementById(domId).insertBefore(replybox, null);
        replybox.src = replyUrlParts[0]
        + (commentId ? '&parentID=' + commentId : '')
        + '#' + replyUrlParts[1];
        replyParent = commentId;
    }
};

                                         
                Perhatikan, bahwa perintah insert before memanggil variable replybox yang perintah nya memanggil elemen form komentar saja. Untuk mengatasi nya, kita harus membuat tag <div> yang menyatukan elemen pesan komentar dan form komentar tersebut lalu mengubah perintah pada variable replybox agar tidak hanya memanggil form komentar nya saja tetapi juga memanggil pesan dari komentar nya juga. Dengan begitu ketika kita mereply komentar, yang berpindah kebawah komentar induk adalah form dan pesan komentar nya.
                Caranya silahkan masuk ke template editor masing-masing, kemudian carilah kode 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(&#39;<data:post.appRpcRelayPath/>&#39;, &#39;<data:post.communityId/>&#39;);
    </script>
  </div>
</b:includable>


Kemudian ganti kode yang berwarna hijau dengan kode dibawah ini :

<div id='form-wrapper'>
    <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%'/>
<p style=”text-align:right; font-size:5px; color:”><a href=http://www.misterdhi.net>Misterdhi.net</a></p>
    </b:if>
</div>

            Pada kode diatas, kita lihat bahwa comment-editor (kode form komentar) dan kode <p><data:blogCommentMessage/></p>(pesan komentar) telah disatukan dalam tag div dengan id form-wrapper. Nah, tag div dengan id tersebut akan menjadi elemen yang akan di panggil oleh variable replybox.
                Sekarang, untuk mengatur perintah replybox nya silahkan cari kode

document.getElementById(domId).insertBefore(replybox, null);

                kemudian ganti kode tersebut dengan kode dibawah ini :

document.getElementById(domId).insertBefore(document.getElementById('form-wrapper'), null);


                Terakhir klik Save Template.
                Sekarang, pesan komentar akan selalu berada di atas form komentarnya dan ketika kita klik tombol reply di komentar pun maka form dan pesan komentar akan berpindah ke bawah komentar induk.
                #semoga bermangfaat
                #salam terhangat dari Misterdhi.


Tulisan ini terinspirasi dari:http://www.dte.web.id/2012/05/masalah-pesan-formulir-komentar-yang.html

31 comments:

  1. I Always be the First Comment..!!! hee :D

    ReplyDelete
  2. wah keren nih tipsnya cocok diterapin di blog ane

    ReplyDelete
  3. kalau pasang google adsense dibawah nya kotak komentar bisa nanti ?

    ReplyDelete
    Replies
    1. tentu bisa dong,, tinggal pasang kode iklan nya dibawah iframe komentar nya saja.

      Delete
  4. jadi seperti kotak komentar punya agan ini

    ReplyDelete
  5. makasih om ntar bisa di coba,,
    makasih om udah share

    ReplyDelete
  6. sip..tutorialnya asyik,,sederhana tapi mudah dipahami :-)

    ReplyDelete
  7. Jadi lebih menarik ini mas pesan komentar selalu diatas akan terlihat kalau mau berkomentar gitu.

    ReplyDelete
  8. alhamdulillah sob,,, form komentar blog saya aman2 saja :D

    ReplyDelete
  9. Bw malam gan di lapaknya sobat,,

    ReplyDelete
  10. hehe... pinter banget sihh..
    saya mengangguk2 aja

    ReplyDelete
  11. Saya malah tidak memberikan aturan kepada pembaca blog saya dalam berkomentar.

    ReplyDelete
  12. ntar saya baca lagi, menarik nihh

    ReplyDelete
  13. BW pagi di lapaknya om ed dolo, hehehe

    ReplyDelete
  14. terimakasih buat tutornya gan, ini memang sangat membantu para blogger

    ReplyDelete
  15. wuidih..ilmu yang keren banget nih, kebetulan pesan komentar ku juga bermasalah...cing saya simpendulu ilmunya kapan2 tak pasang

    ReplyDelete
  16. Wahhh ini masalah yg sedang melanda blogku, hahahaha.. komentar dulu, habis itu baru belajar, wkwkwkwk

    ReplyDelete
  17. wah ini mantap sekali tutorialnya mister. sangat bermanfaat dan berguna sekali untuk membantu mengatasi masalah pada pesan form komentar. terimakasih sudah berbagi :)

    ReplyDelete
  18. nah ini yang ane cari gan, pesan komentar ane kadang turun ke bawah

    ReplyDelete
  19. punya gw sudah bagus sob.. thanks ya..
    visir me back ya.

    ReplyDelete
  20. BW malam dulu om,
    happy blogging

    ReplyDelete
  21. mantep, saya juga pernah memperaktekan cara di atas dan memang hasilnya begitu...sippp.

    ReplyDelete
  22. komisifb.com/?id=ariefsaiful53@gmail.com kunjungi website tersebut

    ReplyDelete

Anda diwajibkan membaca Privacy Policy terlebih dahulu sebelum berkomentar.

Contact

Get in touch with me


Adress/Street

12 Street West Victoria 1234 Australia

Phone number

+(12) 3456 789

Website

www.johnsmith.com