Cara Membuat Lihat dan Sembunyikan Komentar

Published by Admin Selasa, 15 Januari 2013

Pasti salah satu atau malah hampir semua postingan blog kita mendapat komentar yang banyak, sehingga halaman blog kita menjadi semakin panjang. Jika ada seratus komentar, bisa dibayangkan halaman post tersebut akan memanjang ke bawah. Oleh sebab itulah, kita bisa memakai cara ini, yaitu membuat perintah perlihatkan dan sembunyikan komentar.

Sayangnya di bloggger.com atau blogspot belum ada fitur untuk mengatur (setting) jumlah komentar yang ditampilkan seperti di wordpress. Komentar yang banyak bisa ditampilkan menjadi beberapa halaman, misalnya 10 komentar terbaru, dan 10 komentar sebelumnya tidak ditampilkan hanya diberi tautan 'komentar sebelumnya'. Di blogspot sendiri untuk fitur seperti itu hanya berlaku jika komentar lebih dari 200, atau per 200an. Oleh sebab itulah trik ini bisa menjadi alternatif.

Nantinya akan tautan (link) di bawah area post, yaitu pilihan untuk LIHAT KOMENTAR, ketika link itu diklik, maka komentar-komentar akan terlihat. Kemudian saat komentar tampil maka link LIHAT KOMENTAR akan berganti SEMBUNYIKAN KOMENTAR. Penasaran untuk mencoba? Simak cara menampilkan dan menyembunyikan (show and hidden) komentar, berikut ini:

Cara Menyembunyikan dan Menampilkan Komentar
1. Login ke akun blogger.com
2. Pilih Template kemudian Edit HTML
3. Jangan lupa centang Expand Template Widget
4. Cari kode ]]></b:skin> lalu taruh kode berikut di atasnya

a.openpanel {display:block;width:100%;height:40px;padding:0px 0px;text-align:center;font-weight:bold;line-height:30px;background:#ffffff; url()repeat-x;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;position:relative;
    }a.openpanel em {width:0px;height:0px;display:block;position:absolute;top:15px; right:15px;border:6px solid transparent;border-top-color:white;
    }a.openpanel.active {background-color:#ffffff;}a.openpanel.active em {top:6px;border color:#222222;
    }div.paneline {height:0px;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;}div.hompiPanel {padding:10px 20px 20px;margin:0px 0px !important;} 

5. Cari kode </head> lalu taruh kode berikut di atasnya

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
    <script type='text/javascript'>
    //<![CDATA[
    var panelSelector = '#comments',
    openPanelText = "<center><b>LIHAT KOMENTAR</b></a></center>",
    closePanelText = "<center><b>SEMBUNYIKAN KOMENTAR</b></a></center>",
    slideDownPanelSpeed = 800,
    slideUpPanelSpeed = 300;
    //]]>
    </script>
    <script type='text/javascript'>
    </script>
    <script src='http://misbahudin-dcaesga.googlecode.com/files/show-hide.js' type='text/javascript'/>

6. Simpan template jika sudah selesai

Dengan memasang show hidden atau tampilankan dan sembunyikan komentar, semakin membuat space blog menjadi lebih hemat. Tentu pembaca bisa lebih fokus pada postingan blog sebelum melihat atau memberi komentar.