Tuesday 28 August 2018

Cara Membuat Buka Tutup Kolom Komentar Blog

Kolom komentar adalah tempat pengunjung memberikan komentar atau memberikan pertanyaan terkait bahasan dalam posting blog tersebut sehingga si pemilik blog dan para pengunjung / pembaca blog dapat berkomunikasi satu sama lain. Oleh karena itulah kolom komentar menjadi suatu bagian yang penting dalam sebuah Blog.

Akan tetapi kolom komentar memberikan beban tambahan pada saat blog tersebut loading sehingga waktu loading blog menjadi lebih lama, Nah untuk mengatasi permasalahan semacam ini solusinya adalah dengan cara menyembunyikan kolom komentar blog.

Dengan acara menyembunyikan kolom komentar, blog akan tetap terjaga kecepatan loadingnya tanpa harus menghapus atau menghilangkan kolom komentar. Lalu bagaimana caranya menyembunyikan kolom komentar blog? Caranya adalah sebagai berikut:
  • Masuk ke Blogger >> Tema >> Edit HTML
  • Cari kode ]]></b:skin>atau kode </style>gunakan ctrl+F supaya gampang cari kodenya
  • Kemudian kopi kode dibawah ini:
    /* Show and Hide Comments */
    .hide-content{display:none;margin:0;padding:0;}
    a.showcontent,#comments a.hiddencontent{display:block;text-decoration:none;position:relative;color:#fff;font-weight:700;font-size:15px;padding:12.5px 0;background:#5593f0;border:2px solid;border-radius:5px;text-align:center;margin:30px auto;letter-spacing:1px;transition:all .3s}
    #comments a.hiddencontent {background:#fff;color:#acb3b8;transition:all .3s}
    a.showcontent:hover{background:#fff;color:#5593f0;}
    #comments a.hiddencontent:hover{background:#acb3b8;color:#fff;}
    

    lalu paste tepat diatas kode ]]></b:skin>atau kode </style>

  • Kemudian tambahkan kode dibawah ini tepat diatas kode </body>
  • 
    <script type='text/javascript'>
    //<![CDATA[
    // Show and Hide Comments
    function showComm(e){document.getElementById(e)&&("none"!=document.getElementById(e+"-show").style.display?(document.getElementById(e+"-show").style.display="none",document.getElementById(e).style.display="block"):(document.getElementById(e+"-show").style.display="block",document.getElementById(e).style.display="none"))};
    //]]>
    </script>
    

  • Kemudian cari dua kode: <div class='comments' id='comments'> ganti ke-2 buah kode itu dengan kode dibawah ini
    
    <a href="#" id="comments-show" class="showcontent" onclick="showComm('comments');return false;">Show comments</a>
    <div class='clear'/>
            <div class='comments hide-content' id='comments'>
    <a href="#" id="comments-hide" class="hiddencontent" onclick="showComm('comments');return false;">Hide comments</a>
    <div class='clear'/>
    
  • Terakhir jangan lupa save dan lihat hasilnya.

Begitulah cara menyembunyikan kolom komentar blog, Dengan begitu blog akan terasa lebih cepat loading dari sebelumnya. Semoga Bermanfaat.
Comment Policy: Silahkan tuliskan komentar Anda yang sesuai dengan topik postingan halaman ini. Komentar yang berisi link aktiv tidak akan ditampilkan.
Buka Komentar