Cara Membuat Tombol Show Hide Komentar

Sebelum :

Sesudah

• Login ke Dasbor >> Tamplate

• Untuk berjaga-jaga Backup dulu tamplate sobat

• Pilih Edit HTML >> lanjutkan >> Centang "Expand Template Widget"

• Cari kode ]]></b:skin> untuk mempermudah gunakan F3 atau Ctrl F

• Setelah ketemu kode tersebut,, taruh kode di bawah ini tepat di atas kode  ]]></b:skin> 

#comments {
display : none;
}
.stylewadah {background: #none;
padding: 5px;
}

#comments {
display : none;
}
.stylewadah {background: #none;
padding: 5px;
}
a.tombol-komentar{background: #FFFFFF   url(http://i1187.photobucket.com/albums/z389/RICKY_ALDIYANSYAH/plus.gif) 85% 55% no-repeat;display:block;padding:15px 40px 15px 15px;border:1px solid #000000}
a.tombol-komentar:hover{background: #f4f8fc url(http://i1187.photobucket.com/albums/z389/RICKY_ALDIYANSYAH/plus.gif) 85% 55% no-repeat;display:block;padding:15px 40px 15px 15px;border:1px solid #000000;}
a.active.tombol-komentar{background: #f4f8fc url(http://i1187.photobucket.com/albums/z389/RICKY_ALDIYANSYAH/minus.gif) 85% 55% no-repeat;border:1px solid #000000}

• 5. setelah itu,, cari kode </head>

• 6. setelah itu,, Taruh kode di bawah ini tepat di atasnya 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>

• Setelah itu Carilah kode <b:includable id='comments' var='post'> selengkapnya di bawah ini

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

• Terakhir, Letakkan kode dibawah ini, tepat di bawah kode <b:includable id='comments' var='post'>

<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'>Silahkan Berkomentar Disini<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> 

sumber

Artikel Terkait: