Cara Membuat Show/Hide Pada Komentar Blog

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/AVvXsEhK_bXggqu0pzuN_2HJ7xBYrtINqIG5Z165sq32zEcjYkhcRVpMfGy6V5OsU13C3PT_dVuvLbqBfdvkj-5CVOij57QuothffGjGFKD8LC64xFQmz3MXN6kRzxlmamyKd_EsO8QOYCifix-d/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.

• Tweet
• Share
• Share
• Share
• Share

About ansud-site

Terima Kasih Sobat alls well Atas Kunjungannya di Blog Sederhana Ini, Semoga Selalu Menginspirasi dan Bermanfaat Bagi Dunia Pendidikan Di Tanah Air Tercinta Indonesia.SALAM PENDIDIKAN

Related Post