Cara Membuat Show/Hide Pada Komentar Blog

Stelah kemareen membahas tentang  Cara Membuat Daftar Isi Blog Berdasarkan Label Otomatis
pada kesempatan kali ini saya mau  posting artikel tentang
Cara Membuat Show/Hide Pada Komentar Blog  Sering kita melihat blog seseorang yang disitu terdapat arikel yang banyak sekali visitor/pengunjung yang berkomentar pada artikel tersebut. Nah, kali ini saya ingin berbagi tentang Cara Membuat Menu Show/Hide Pada Komentar Blog yang berfungsi untuk menghemat tempat agar tidak telalu panjang dan tidak memperlambat loading saat membuka artikel yang dikarenakan banyaknya pengunjung yang berkomentar pada artikel tersebut.

  Ikuti cara-caranya di bawah ini:

1. Login ke blogger
2. Klik Rancangan >> Edit HTML >> centang Expand Template Widget
3. Cari kode ]]></b:skin> jika sudah ketemu, Copy kode dibawah ini, Paste di atas kode ]]></b:skin>

a.openpanel {display:block;width:100%;height:40px;padding:0px 0px;text-align:center;font-weight:bold;line-height:30px;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5LdVhnZQcK9Bf5OGh4e0fFMRqiRU7hYkrX5IaE_Y1w0qwCigFgV0it0GZdPUGvqN0GN3hXy-vMcGYhMZj1Ft4oVglVLG63eomBDNMbH7AjbOwwJWZc0exxoumMvxb9K7mUhuroLAn4mgb/s1600/topmenueva.jpg)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:#;}a.openpanel.active em {top:6px;border color:transparent transparent white transparent;
}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;}

4. Kemudian cari kode </head> jika sudah ketemu, copy dan paste kode di bawah ini sebelum </head>

<script type='text/javascript'>
//<![CDATA[
var panelSelector       = '#comments',
    openPanelText       = "Buka Komentar",
    closePanelText      = "Tutup Komentar",
    slideDownPanelSpeed = 600,
    slideUpPanelSpeed   = 400;
//]]>
</script>
<script type='text/javascript'>
</script>
<script src='http://evawangi.googlecode.com/files/slidekomentar.js' type='text/javascript'/>

5.  Simpan Template.

Sahabat dapat memodifikasi kembali tampilannya sesuai selera sahabat. Selamat mencoba dan semoga berhasil dan bermanfaat buat sahabat.