Blog Personal Untuk berbagi Hal Yang Bermanfaat.

Friday, December 23, 2011

cara membuat kotak komentar show hide

Langsung aja ke tkp
Photobucket



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;
}

 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(){
    $(&quot;.tombol-komentar&quot;).click(function(){
        $(&quot;#comments&quot;).slideToggle(&quot;slow&quot;);
        $(this).toggleClass(&quot;active&quot;);
        return false;
    });
});
</script>

 Cari kode seperti dibawah ini (ctrl+F untuk mempermudah pencarian) :

</b:includable>
<b:includable id='comments' var='post'>

.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> 

save template
selesai deh...selamat mencoba,semoga berhasil

3 comments:

Silahkan berkomentar...
Catatan: jangan menulis link hidup.Silahkan tinggalkan komentar sobat dengan menggunakan opsi Name/URL. Mohon jangan komentar SPAM ya..! Komentar dengan menyertakan LINK / ANCHOR TEXT atau promosi produk tertentu akan saya hapus karena blog ini bukan tempat untuk mempromosikan produk yang dijual di blog anda.

Post Top Ad

Your Ad Spot

Pages