Tutup Buka Kotak Komentar

Jumat, 10 Agustus 2012 | 41komentar

Tutup Buka, Buka Tutup Kotak Komentar adalah pencarian seorang newbie di penelusuran google, namun terdampar di Tutorial For You dengan Cara Membuat Show Hide Pada Komentar Dengan JQuery. Blogger yang baik adalah membutuhkan, mencari, mendapatkanya, menerapkan lalu mengamalkannya (hihi..,mengelak dari sebutan flagiat !).

Tutup Buka Kotak Komentar

Yup.., pada awalnya karena memang saya membutuhkan tips untuk Tutup Buka Kotak Komentar blog ini. Semua tips telah saya coba, mulai dari Cara Memberi Efek Spoiler Pada Kotak Komentar, Membuat Toggle Spoiler Untuk Menampilkan dan Menyembunyikan Kotak Komentar Blog, hingga Modifikasi Kotak Komentar, namun semua itu tidak ada yang manjur untuk template yang saya pakai ini.

Hanya Cara Membuat Show Hide Pada Komentar Dengan JQuery yang menjadi jodoh untuk diterapkan di template Shaka InghetS ini. Seperti petuah Mas Admin Andreas bahwa untuk membuat Tutup Buka Kotak Komentar blog, sobat mesti ;

1.    Login ke Blogger
2.    Pilih Design > Edit HTML
3.    Cari kode ]]></b:skin>
4.    Copy kode di bawah ini dan pastekan tepat di atas kode ]]></b:skin>
a.openpanel {display:block;width:100%;height:40px;padding:0px 0px;text-align:center;font-weight:bold;line-height:30px;background: url(http://3.bp.blogspot.com/-XRbR8LuN_KA/T_sz_OhRvcI/AAAAAAAAAT0/WsgP9ipdi4s/s1600/topmenueva.jpg)repeat-x;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;position:relative;
}a.openpanel em {width:0px;height:0px;display:block;position:absolute;top:15px; right:15px;border:6px solid transparent;border-top-color:white;
}a.openpanel.active {background-color:#;}a.openpanel.active em {top:6px;border color:transparent transparent white transparent;
}div.paneline {height:0px;-webkit-transition: all .15s ease-in-out;-webkit-transform-origin: 50% 1px;}div.hompiPanel {padding:10px 20px 20px;margin:0px 0px !important;}
5.    Kemudian cari lagi kode </head>
6.    Copy kode di bawah ini dan pastekan tepat di atas kode </head>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var panelSelector       = '#comments',
    openPanelText       = "Buka Komentar",
    closePanelText      = "Tutup Lagi Komentarnya !",
    slideDownPanelSpeed = 600,
    slideUpPanelSpeed   = 400;
//]]>
</script>
<script type='text/javascript'>
</script>
<script src='http://evawangi.googlecode.com/files/slidekomentar.js' type='text/javascript'/> 
7.    Setelah selesai simpanlah template sobat dan lihat hasilnya.

Catatan:
Ada sedikit penambahan pada URL background dengan menambahkan ;
http://3.bp.blogspot.com/-XRbR8LuN_KA/T_sz_OhRvcI/AAAAAAAAAT0/WsgP9ipdi4s/s1600/topmenueva.jpg
 Lalu pada :
openPanelText = yang dirobah dengan kata-kata sendiri Buka Komentar
closePanelText = yang dirobah dengan kata-kata sendiri Tutup Lagi Komentarnya !


Share this article :
Judul: Tutup Buka Kotak Komentar
Rating Blog: 5 dari 5
Ditulis oleh Eva Wangi
Anda sedang membaca artikel Tutup Buka Kotak Komentar. Anda bebas Copas untuk kode HTML pada Tutorial Blogging dan Tips Blogging, namun jika terpaksa ingin mengutip secara keseluruhan harap memberikan link aktif dofollow ke URL inihttp://evawangi.blogspot.com/2012/08/tutup-buka-kotak-komentar.html. Terima kasih sudah singgah dan berkomentar di blog ini.

41 komentar:

  1. Makasih tutorialnya sob...

    salam persahabatan..

    BalasHapus
    Balasan
    1. Masam sop,salam balik.
      Thanks ya.

      Hapus
  2. wah bagus sekali sob...:D
    nanti saya cb ya sob, biar kliatan rapi kotak komentarnya.
    makasih ya sob happy blogging.

    BalasHapus
    Balasan
    1. Nah itu dia sop,komentar baru 10 buah saja panjangnya sudah tak ketulungan,apalagi bila sudah ratusan.
      Dengan spoiler komentar ini,selain rapih buka postingan juga jadi tambah ringan.
      Makasih sudah bisa berbagi disini.
      Happy blogging.

      Hapus
  3. Makasih tutorialnya sobat...

    BalasHapus
    Balasan
    1. Masama kawan.
      Happy blogging ajah.

      Hapus
  4. tambah mantap aja, dengan buka tutup komentarnya
    salam kenal

    BalasHapus
    Balasan
    1. Yang mantap tetap Tutorial 4 U,hihi.
      Senang hati bisa kerjasama denganmu sop,makasih banyak yach.
      Happy blogging.

      Hapus
  5. wah, thanks sob tutorialnya...
    ane coba di blog ane sukses berat....
    visit ke blog ane yah.... :D

    BalasHapus
    Balasan
    1. Senang hati sudah bisa ikut mengamalkannya sop,meski cuma satu ayat(kode),hihi.
      Ane sudah ke tkp,blogmu keren abis,makasih sudah singgah disini.

      Hapus
    2. thanks sdh singgah ke blog ane.....
      :D

      Hapus
  6. Mantab tutorialnya dan merasa terbantu.. eh iya mohon bantu di follow balik sob, blog saya udah mandeg dan saya follower sob yg ke 43.. thx :)

    BalasHapus
  7. Bermanfaat sekali tutorial ini ... kolom komentar blog saya panjang banget ... Simpan dulu ya .. ntar tak terapin..

    BalasHapus
  8. untuk blog saya bisa gak ya..?

    BalasHapus
  9. kya nya patut di coba nih :)
    trims sob tutornya ya :)

    BalasHapus
  10. saya pakenya model yg lain, pas sekalinya dipasang balas komentar, show/hidenya jadi ga fungsi.
    alternatif buat dicoba lagi nih.
    nuhun tipsnya, salam

    BalasHapus
  11. Sepertinya harus di coba neh sob,,,,terima kasih untuk tutornya yang sangat bermanfaat ini

    BalasHapus
  12. mantab sahabatku tipsnya..
    I like it..
    salam super yah.. :)

    BalasHapus
  13. Mantap nih Tutorials, Kira2 saya perlu terapin ngx ya di blog saya ?

    BalasHapus
    Balasan
    1. Hajar aza sob,tapi manfaatkan ya.

      Hapus
  14. Dulu waktu saya belum pake komentar FB dan blog berjajar pengen pake sob,mungkin akan saya terapkan di blog saya yang satunya lagi,..nice share sob.........

    BalasHapus
  15. Diblog ane sukses terpasang sop,mohon dicek.Makasih tipsnya.
    Salam.

    BalasHapus
  16. Wah... keren ini... ijin copas buat referensi pribadi Mbak Bro... :)
    Salam bLogger,

    BalasHapus
  17. Bagus sekali gan...
    saya akan mencobanya....
    ada yg perlu saya tanyakan gan, pada komentar saya kok gak ada gambarnya yah, hilang kemana nih...tlolong bantu jawaban gan..terima kasih

    BalasHapus
    Balasan
    1. Koneksi internetnya lagi melambat mungkin Gan, atau bisa saja dari latar MUSIK(di Wawasan Dunia Blogger).

      Maksudnya gambar untuk Tutup Buka ini Pak?
      Coba pakai gambar ini : http://2.bp.blogspot.com/_4HKUHirY_2U/TT7jruHfE_I/AAAAAAAAL6E/Ub0dYSDZM40/s1600/widget-title-bg.png
      Bila untuk di pasang di Penyuluh Perikanan.

      Dan bila mau di pasang di Wawasan Dunia Blogger pakai gambar latar yang lebih ringan.

      Makasih kembali Pak,happy weekend and happy blogging.

      Hapus
  18. mantap kang...
    hnya saja sya uda terlanjur make alternatif scroll pada komentar blog sya.. :(

    BalasHapus
  19. wah... first time momoy jumpa tutorial bagus begini.
    tapi momoy masih belum terfikir mau gunanya
    sebab komentar blog momoy sikit bangat

    dear, makasih sudi mampir ke blog momoy ya

    BalasHapus
    Balasan
    1. Jaga-jaga aza Moy untuk nanti bila komentarnya sudah banyak.
      Makasih kunjungannya sahabat terbaik,salam erat kebersamaan dari saya.
      Happy weekend and happy blogging.

      Hapus
  20. baik dear eva
    ngak sangka owner belog tutorial ini milik gadis cantik
    salam ramadhan ya eva.

    BalasHapus
  21. Sudah saya coba tapi kok engak bisa.

    BalasHapus
    Balasan
    1. Saya rasa di Template Blue Minimalist yang anda pake,untuk tips ini ga bakalan ada kesulitan.
      Coba teliti lagi sop,barangkali ada kode yang tertimggal disini.
      Atau sobat bisa cek ke :
      http://loadtemp.blogspot.com/2012/08/percobaan-buka-tutup-kotak-komentar.html
      Ok bro,maksih ya.

      Hapus
  22. Sudah saya coba lagi ternyata bisa,makasih banget ya sobatku :D.

    BalasHapus
  23. saya coba sukses di blog ku sist, tapi aku lebih nyaman yang biasa aja ox.hihi

    BalasHapus
  24. nah ini yang saya cari...
    jadikan tambah keliatan elegannya ...
    hehehehehe..
    thanks sobat buat tutorialnya....
    dan ternyata berhasil...

    BalasHapus
  25. Makasi gan tutorialnya,, skarang para komentator diblog saya udah jadi tersembunyi,,, kreen banget dah...

    BalasHapus
  26. Sebelumnya trimakasih,sangat bermanfaat.. :)
    sobb klo mau di ganti warna kotak nya itu dan warna tulisan komentanya gmn?? thx

    BalasHapus
  27. gan kalau saya ingin ubah warna teknya menjadi puti gimana

    BalasHapus
  28. Punyaku tidak jadi kenapa ya?

    BalasHapus
  29. Joss....mantab surantabbb tutor nya....!!!!izin praktekin ya..!!!!

    BalasHapus

Tulis Komentar Yang Menyejukan Hati saja.
Tidak menerima Komentar Yang bermuatan Sara, Politik, Makar,
tidak pula Komentar Yang menjurus Iklan.
Terima Kasih sudah sedikit meluangkan Waktunya disini!

Ketik Yang Sobat Mau !

Artikel Terbaru

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2012. Shaka InghetS - All Rights Reserved
Template Modify by Creating Website
Proudly powered by Blogger