Posted by Akhmad Zaenal Blog's on Sabtu, 30 Juni 2012
Sudah pernah lihat kotak komentar Show/Hide? atauseperti menu dengan tombol untuk membuka
dan menutup menu yang kita inginkan, untuk lebih jelas lihat gambar dibawah ini
Cara Membuatnya
- Login blogger
- Rancangan, Edit Html
- Download Template Lengkap
- Centang menu Expand Template Widgets
- Cari kode ]]></b:skin> dan simpan CSS berikut diatasnya :
#comments {
display : none;
}
.tombol-komentar a{
text-align: center;
}
.stylewadah {background: #CCC;
padding: 5px;
}
6. Berikutnya simpan Script berikut diatas kode
</head> :
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
$(".tombol-komentar").click(function(){
$("#comments").slideToggle("slow");
$(this).toggleClass("active");
return false;
});
});
</script>
7. Cari kode seperti dibawah ini (
ctrl+F untuk mempermudah pencarian) :
</b:includable>
<b:includable id='comments' var='post'>
8. Jika sudah ketemu simpan kode berikut dibawah kode yang dicari tadi :
<center>
<div class='stylewadah'>
<a class='tombol-komentar' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<b:if cond='data:post.numComments == 0'>No Comments be the
first<b:else/><b:if cond='data:post.numComments == 1'>1
<data:top.commentLabel/><b:else/><data:post.numComments/>
<data:top.commentLabelPlural/></b:if></b:if>
</a>
</div>
</center>
9. Simpan template dan lihat hasilnya. semoga bermanfaat.
