Show Hide Comments
Nah kali ini saya mau sharing sedikit tentang cara modifikasi komentar. Yaitu membuat Show atau hidden komentar yang masuk di Blog kita dengan menggunakan CSS, Javascript dan Jquery 1.6.2. Mungkin bagi blog sobat yang mempunyai komentar masuk cukup banyak bisa menerapkan cara ini agar blog sobat terlihat sedikit rapi dan simple. Karena dengan membuat tampilan blog itu rapi dan menarik akan membuat pengunjung sedikit betah. Oke Sobat langsung aja silahkan ikuti langkah-langkahnya dibawah ini, dan bagi yang sudah tahu cara ini lewati aja.
Langkah-langkah pemasangannya :
- Login ke Blog Sobat
- Masuk Ke edit HTML (Centang Expand Template Widget).
- Copy CSS dibawah ini dan pastekan diatas kode ]]></b:skin>
- Copy dan pastekan javascript dibawah ini tepat diatas kode </head>
- Cari kode <div class='comments' id='comments'> (kode ini ada 2).
- Selanjutnya Copy dan pastekan kode HTML dibawah ini, tepat diatas kode <div class='comments' id='comments'>
- Klik simpan dan semoga berhasil.
#comments{display:none;
}
.cocot{width:auto;font-size:20px;margin:0;border:2px solid #C4CDE0;-moz-box-shadow:0 0 10px #000;-webkit-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;background:#000;
}
.cocot a{color: #C4CDE0;text-align:center;
}
.cocot:hover{background:#0080FF;-moz-box-shadow:0 0 10px #000;-webkit-box-shadow:0 0 10px #000;box-shadow:0 0 10px #000;
}
.cocot:active{background:#fc0;
}<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").click(function(){$("#comments").slideToggle("slow");$(this).toggleClass("active");return false;});});</script><div class='cocot'><a class='tombol' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>♣|| Click To Post Comments ||♣</a></div>Oke Sobat sekian dulu semoga Cara menyembunyikan komentar (show hide comments) ini bisa sedikit bermanfaat. (source : Mbah Google)
Posted On : 3 Mei 2012 Time : 15.23
