Cara buat Tombol Show/Hide pada Comment

Ok, kita langsung saja ya pada pokok bahasan yaitu Cara Membuat Tombol Show/hide Area Komentar.

saya tidak akan menjelaskan dari awal login karena mungkin sobat sudah pada paham bagaimana caranya kalau mau mengedit template.
Sobat letakan kode CSS berikut tepat diatas kode



]]></b:skin>

a.bukacoment {
display:block;
clear:both;
width:auto;
padding:0px 0px;
text-align:center;
font-size:14px;
font-weight:bold;
line-height:30px;
background-color:#000;
color:white;
text-decoration:none;
margin:0px 0px;
position:relative;

}

a.bukacoment em {
width:0px;
height:0px;
display:block;
position:absolute;
top:10px;
right:10px;
border:6px solid transparent;
border-top-color:white;

}

a.bukacoment.active {background-color:#900;}
a.bukacoment.active em {
top:6px;
border-color:transparent transparent white transparent;

}

div.btsbawah {
height:0px;
border-bottom:4px solid #ff0000;

}

div.jqcoment {
padding:0px;
margin:0px 0px !important;

}

Kemudian sobat letakan kode Javascript berikut tepat diatas kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var panelSelector = '#comments',
openPanelText = "Poskan Komentar",
closePanelText = "Tutup Komentar",
slideDownPanelSpeed = 600,
slideUpPanelSpeed = 400;
//]]>
</script><script src='http://elina.googlecode.com/files/Buka-coment.js' type='text/javascript'/>

Perhatikan kode yang diberi garis bawah, itu library JQuery bila template sobat sudah ada kode tersebut maka kode bergaris bawah tersebut hapus saja.

#comments ini adalah ID area komentar bila ID area komentar sobat berbeda silahkan ganti dengan kode ID area komentar sobat.

Poskan Komentar ini kalimat yang tampil sebelum diklik, sobat bisa ganti sesuai keinginan
Tutup Komentar ini kalimat yang tampil setelah diklik, sobat bisa sesuaikan.
600 dan 400 adalah kecepatan membuka dan menutup kotak komentar.
Sebagai tambahan bila pada template sobat menggunakan Library Jquery versi dibawah 1.7.2 maka sobat ganti saja Jquery tersebut dengan JQuery 1.7.2.


Semoga Bermanfa'at.....

Jangan Lupa Untuk Membagikan Artikel Ini Ok