ads
Home » » ShowHide pada kotak Komentar

ShowHide pada kotak Komentar

Written By Ramadhan Fnw on Oct 22, 2011 | 7:45 PM

Post kali ini respon dari request teman saya. hehe,, yaitu membuat ShowHide pada kotak komentar. (Seperti di blog ini).
Oke, tanpa basa-basi langsung aja ke stepnya.

Sebelumnya "Download Template Lengkap" dahulu, biar lebih aman. :)

Pertama, login akun blogger kalian.
Masuk ke Rancangan -> Edit HTML
Centang


Lalu cari kode ini

]]></b:skin>

Lalu paste kan kode dibawah ini, tepat diatasnya

#comments {
display : none;
}
.show-hide a{
text-align: center;
}
.ramastyle {background: #CCC;
padding: 5px;
}

Lalu cari kode

</head>

Simpan kode script dibawah ini tepat diatas kode tadi

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

Langkah terakhir...
Cari lagi kode dibawah ini

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

Lalu letakkan kode ini dibawahnya

<center>
<div class='ramastyle'>
<a class='show-hide' 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>

SIMPAN TEMPLATE dan lihat hasilnya.. GOOD LUCK.. ^^

Share this article :

13 komentar:

DODE-XP.COM said...

ini request-an saya gan :)

Share Our Knowledge said...

@DODE-XP: Iyaa,, hehe :)

Musa Khairul Umam said...

Mantep,mantep nih :D

Share Our Knowledge said...

@Musa Khairul Umam: Iya so,, silahkn dicoba.. hehehe

Uda Cucanto said...

@Agan-Aganwati Aye Punya Tantangan Nih!

http://tentangduniadanweb.blogspot.com/2011/10/silahkan-masuk-kalau-bisa.html

Siapa Yang Bisa Menyelesaikan Tantangan Tersebut Dapat Hadiah Lho!!

Hadiahnya Saya Akan Memberikan Review Tentang Blog Anda!

Ayo Silahkan Dicoba
Sekalian Asah Kepintaran
Kalau Bisa Pasti Anda Punya Skill Untuk Mjdi Hacker

Tantangan

Anonymous said...

@Agan-Aganwati Aye Punya Tantangan Nih!

http://tentangduniadanweb.blogspot.com/2011/10/silahkan-masuk-kalau-bisa.html

Siapa Yang Bisa Menyelesaikan Tantangan Tersebut Dapat Hadiah Lho!!

Hadiahnya Saya Akan Memberikan Review Tentang Blog Anda!

Ayo Silahkan Dicoba
Sekalian Asah Kepintaran
Kalau Bisa Pasti Anda Punya Skill Untuk Mjdi Hacker

Tantangan

Rama88 said...

wahhh lebih simple ya gan,, bisa menghemat tempat,, hehhe,, thx for sharing ,,

Wahyu Silenticlever said...

wah,, keren ini gan..

Share Our Knowledge said...

@Uda Cucanto: :D,. saya berani tapi gk bisa.. :D

Share Our Knowledge said...

@Rama88: iya gan,, menurut saya juga menarik.. hehe

Share Our Knowledge said...

@Wahyu Silentclever: thx gan,, hehe

Shinobi Caemk said...

bagusan mana sob showhidden atau pake scroll ???? .. :)

Share Our Knowledge said...

@Shinobi Caemk: itu terserah kehendak hati kalian,, :D

kalo saya sih bagus ini,, lebih mempercantik. bisa di buka bisa di sembunyiin.. hehe

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Share Our Knowledge - All Rights Reserved
Template Modify by Creating Website Inspired Wordpress Hack
Proudly powered by Blogger