Cara Membuat Show Hide komentar dengan jquery

Belajar SEO dan Blog Bagi pemula
Masih di Variasi Blogger share Cara Membuat Show Hide komentar dengan jquery cekidot

Silahkan log in terlebih dahulu di blog sobat >> klik Rancangan >> klik Edit HTML >> centang Expand Template Widget , kemudian tekan ctrl + F paste script ]]></b:skin> jika sudah ketemu silahkan Copy Paste script dibawah ini dan simpan sebelum kode tadi

#comments {
display : none;
}
.stylewadah {background: #none;
padding: 5px;
}
a.tombol-komentar{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.tombol-komentar:hover{background: #7FFF00  url(http://i1187.photobucket.com/albums/z389/RICKY_ALDIYANSYAH/plus.gif) 85% 55% no-repeat;display:block;padding:15px 40px 15px 15px;border:2px dashed #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}

Kemudian silahkan cari kembali kode script </head> jika sudah ketemu silahkan simpan kode di bawah ini sebelum </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>

Satu langkah lagi sobat cari kembali kode script di bawah ini

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

jika sudah ketemu silahkan tambahkan kode di bawah ini sesudah kode script 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'>Silahkan Luangkan Waktu Sobat Untuk Berkomentar Di Artikel Ini<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 , oia sobat bisa utak - atik kembali tampilannya sesuai selera sobat , semoga berhasil dan bermanfaat


Share to

20 Responses to "Cara Membuat Show Hide komentar dengan jquery"

  1. Terima kasih sahabat telah berbagi ilmunya ini

    BalasHapus
    Balasan
    1. yups, semoga bermanfaat.. :D

      Hapus
  2. Ini contohnya seperti ayang ada di blog ini ya sob?
    Akan saya coba, mudah-mudahan nggak bentrok sama script jquery yang lainnya...

    wilujeng ngeblog
    Sakahayang Dot Com

    BalasHapus
    Balasan
    1. ya kang tapi sekarang udah gak dipasang lagi hehehe... :>)

      Hapus
  3. infonya bagus sob,,
    mungkin bisa sy terapin di blog sy yng lain,,

    Salam dari blogger pemula sob,, :)

    BalasHapus
    Balasan
    1. iya sob... semoga bermanfaat :)

      Hapus
  4. terima kasih bang codenya.. ini sangat membantu blog ane.....

    BalasHapus
    Balasan
    1. ya sob , semoga bermanfaat.. :D

      Hapus
  5. Blog anda saya kasih backlink pada artikel "On Off Komentar dengan jQuery" di Sakahayang Dot Com karena artikel tersebut mengambil script dari artikel anda disini.

    Wilujeng ngeblog

    BalasHapus
  6. salam kenal sob, saya coba pasang, tapi ga jalan, kenapa yah?

    BalasHapus
    Balasan
    1. masa sih sob ??? saya coba pasang di blogs ini lancar - lancar aja kok :D

      Hapus
  7. Ini tutorial yang ane cari2 dr maren.....izin nyoba ya sob :)

    BalasHapus
    Balasan
    1. silahkan sob , semoga bermanfaat... :D

      Hapus
  8. Muwanteb banget sob...

    BalasHapus
  9. Kalo dibuat seperti ini jadi makin ringkas mas bro, keren ..

    BalasHapus
    Balasan
    1. iya sob jadi lebih simple komentarnya hehehe... :D

      Hapus
  10. Kepingin buat seperti ini biar lebi irit halaman posting,
    Makasih ilmunya

    BalasHapus
    Balasan
    1. yups sob.. , semoga bermanfaat... :D

      Hapus
  11. Nice trick sob! Salam blogger :)

    BalasHapus

Jika ada Tutorial Info Blog Indonesia ini, yang kurang dimengerti silahkan luangkan saja waktu anda untuk berkomentar, karena pertanyaan anda sangat berharga untuk perkembangan dan kemajuan blogs ini.

Soalnya diblogs ini adalah wadah untuk belajar mengenal webs/blogs, disini kita sama - sama belajar, seandainya anda adalah seorang pakar blogger profesional atau pakar seo indonesia bimbinglah saya, untuk menulis artikel berkualitas.

Oia sebelum menyisipkan script silahkan gunakan tools konversi terlebih dahulu untuk menampilkan kode tersebut pada kolom komentar.

Terimakasih.. salam kenal dan salam hangat untuk blogger indonesia, yang selalu setia di Info blog Indonesia variasi blogger.

¯\(◕ ‿◕)/¯



convert TOS

ADMIN Blog