Cara Membuat Spoiler Pada Komentar

Assalamu ‘alaikum sobat blogger semua, kali ini Muro’i El-Barezy akan berbagi sedikit tips, bagaimana membuat spoiler pada komentar blog, ini berfungsi untuk menyembunyikan komentar dan akan muncul ketika di klik. Oke langsung saja, caranya sangatlah mudah :
Buka dasbor blog sobat >>Klik template >> Klik edit HTML >>Klik Expand Template Widget dan temukan kode berikut (untuk memudahkan ,tekan Ctrl + f ) :

<div class='comments-content'>
      <b:if cond='data:post.embedCommentForm'>
        <b:include data='post' name='threaded_comment_js'/>
      </b:if>
      <div id='comment-holder'>
         <data:post.commentHtml/>
      </div>
</div

Setelah sobat menemukan kode diatas, silakan copy script dibawah ini, persis diatas kode tadi :

<!-- spoiler komentar part1 -->
<div><div style='margin-bottom: 2px;'><i><b><small/></b></i><input onclick='if (this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display != &apos;&apos;) { this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display = &apos;&apos;; this.innerText = &apos;&apos;; this.value = &apos;Hide&apos;; } else { this.parentNode.parentNode.getElementsByTagName(&apos;div&apos;)[1].getElementsByTagName(&apos;div&apos;)[0].style.display = &apos;none&apos;; this.innerText = &apos;&apos;; this.value = &apos;Lihat Komentar Disini&apos;; }' style='margin: 0px; padding: 0px; width: 200px; font-size: 15px;font-weight:bold;' type='button' value='Lihat Komentar Disini'/></div>
<div style='border: 0px inset ; margin: 0px; padding: 0px;'><div style='display: none;'>
<!-- spoiler komentar part1 end -->

Langkah terakhir adalah klik SAVE.
Gimana, mudahkan? Selamat mencoba dan semoga berhasil.

Catatan :
  • Sebelum oprek oprek, silakan sobat beck up dulu templatenya.
  • Jika gagal, silakan sobat taruh script dibawah ini setelah kode  yang berwarna biru. Berikut scriptnya :

<!-- spoiler komentar part2 -->
</div></div></div>
<!-- spoiler komentar part2 end -->



   

Post a Comment

29 Comments

  1. wah ini lebih baik menggunakan spoiler untuk mengurangi loading blog dan membuat komentar terlihat rapi sobat...

    ReplyDelete
  2. wah ini contohnya ya...mantap sekali gan. makasih ni tutorialnya, ntar kolo saya mau pake tinggal ke sini. ok gan

    ReplyDelete
  3. Makasih infonya mas, nanti di coba.... ^^

    ReplyDelete
  4. Wah..keren juga nih infonya..Terimakasih infonya... :)

    ReplyDelete
  5. Wah..setelah ane coba..ternyata ga bisa sob..ada yg salah ya???

    ReplyDelete
    Replies
    1. coba lagi sob, sudah ane perbaiki scriptnya, semoga berhasil

      Delete
  6. keren sob jadi blognya gak keliatan panjang,,,

    ReplyDelete
  7. Wah keren ^^
    Spoiler memang bikin blog kita hemat tempat :D

    Sy sudah coba pak eL, dan berhasil di blog sy.
    Awalnya pake langkah 1 tdk bisa, tp stelah ditambah kode yg dibawah berhasil.

    Makasih pak, sering2 sj ya posting tips2 buat memperindah blog spt ini, hehe...

    ReplyDelete
  8. mantap sekali mas tutorialnya.. blognya jadi keliatan lebih rapi dan hemat tempat yaa.. bagus

    ReplyDelete
  9. gimana Bos kok gak jadi di html5 ya....share ke info toko surya62 ya trim's

    ReplyDelete
  10. Wah, ini baru keren dan berguna sob, keren karena terlihat simple, berguna karena membantu meringankan loading blog kita yg lama karena memuat komentar yang begitu banyak, kalo blog ane sih, komentarnya masih sedang-sedang saja, hehehe, belum banyak

    ReplyDelete
  11. boleh nih dicoba, nice share and salam kenal

    ReplyDelete
  12. Terima kasih :) jadi gak makan banyak tempat :)

    ReplyDelete
  13. Saya udah coba tapi gagal.. udah taroh kode kedua di bawah kode biru tapi tetep gagal juga,, gimana ya??

    ReplyDelete
    Replies
    1. coba deh lebih teliti lagi mungkin ada yg ketinggalan, sobat yg lain sudah pernah coba dan berhasil

      Delete
  14. saya sudah pernah coba spoiler dan berhasil

    tapi kalau komentar nya dirubah jadi thread seperti ini, spoilernya jadi hilang

    bagaimana ya mas.?
    bingung saya :O

    ReplyDelete
    Replies
    1. sobat pastikan membuat threaded terlebih dahulu, kemudian membuat spoiler setelahnya, silakan dicoba kembali

      Delete
  15. punya sya gagal gan, ada solusinya gk. Ditunggu jawabannya

    ReplyDelete
  16. sip dah ,tapi ni tombolnya gede amatya

    ReplyDelete
  17. laporin bro, tutorialnya gagal diblog saya :D

    ReplyDelete
    Replies
    1. scriptnya tidak ada yang salah sob, coba lebih teliti lagi penempatannya

      Delete
  18. Pingin ucapin terima kasih Mas..... Tips ini saya gunakan

    ReplyDelete
  19. Produk dijamin asli.
    Dina Shop : Barang yang Kami Tawarkan Semuanya Barang ASLI ORGINAL Garansi Resmi Distributor dan gransi TAM.
    Semua Produk Kami Baru dan Msh Tersegel dLm BOX_nya.
    BERMINAT HUB-SMS:0896-9198-6257 ATAU KLIK WEBSET RESMI KAMI DI http://dina-shop7.blogspot.com/.
    BlackBerry>Samsung>Nokia>Apple>Acer>Dell>Nikon>DLL

    BLACKBERRY
    Asli Buatan Canada.
    HARGA PROMO

    BlackBerry 8230 Rp. 500.000
    BlackBerry 8330 Rp. 500.000
    BlackBerry 8700 Rp. 500.000
    BlackBerry 8830 World Edition Rp. 500.000
    BlackBerry 9330 kepler Rp. 1.100.000
    BlackBerry Bold 9000 Rp. 1.100.000
    BlackBerry Bold 965 Rp. 900.000
    BlackBerry Bold 9700 (Onyx) Rp. 700.000
    BlackBerry Bold 9780 (Onyx II) Rp. 800.000
    BlackBerry Bold 9790 (Bellagio) Rp. 1,100.000
    BlackBerry Bold Touch 9900 (Dakota) Rp. 1,500.000
    BlackBerry Bold Touch 9930 (Montana) Rp. 1,200.000
    BlackBerry Curve 3G 9300 (Kepler) Rp. 700.000
    BlackBerry Curve 3G 9330 Rp. 700.000
    BlackBerry Curve 8310 Rp. 550.000
    BlackBerry Curve 8320 Rp. 600.000
    BlackBerry Curve 8520 (Gemini) Rp. 500.000
    BlackBerry Curve 8530 Rp. 550.000
    BlackBerry Curve 8900 (Javelin) Rp. 700.000
    BlackBerry Curve 9220 (Davis) Rp. 650.000
    BlackBerry Curve 9320 (Armstrong) Rp. 700.000
    BlackBerry curve 9330 cdma-berrindo Rp. 800.000
    BlackBerry Curve 9350 Rp. 800.000
    BlackBerry Curve 9360 (Apollo) Rp. 950.000
    BlackBerry Curve 9370 Rp. 800.000
    BlackBerry Curve 9380 (Orlando) Rp. 900.000
    BlackBerry Pearl 3G 9100 Rp. 700.000
    BlackBerry Pearl 3G 9105 Rp. 700.000
    BlackBerry Pearl 8100 Rp. 500.000
    BlackBerry Pearl 8120 Rp. 500.000
    BlackBerry Pearl 8130 Rp. 500.000
    BlackBerry Pearl Flip 8220 Rp. 600.000
    BlackBerry Pearl Flip 8230 Rp. 500.000
    BlackBerry PlayBook Rp. 1,200.000
    BlackBerry PlayBook 64GB Rp. 1,200.000
    BlackBerry PlayBook-32GB Rp. 1,200.000
    BlackBerry porsche design p'9981 Rp. 4,8250.000
    BlackBerry porsche design p'9981 Rp. 4,4500.000
    BlackBerry Storm 9500 Rp. 700.000
    BlackBerry Storm2 9520 Rp. 700.000
    BlackBerry Storm2 9530 Rp. 600.000
    BlackBerry Storm2 9550Rp. 650.000
    BlackBerry Style 9670 Rp. 650.000
    BlackBerry Torch 9800 Rp. 1,200.000
    BlackBerry Torch 9810 Rp. 1,350.000
    BlackBerry Torch 9850 Rp. 1,100.000
    BlackBerry Torch 9860 (Monza) Rp. 1,400.000
    BlackBerry Tour 9630 Rp. 650.00

    ReplyDelete
  20. aku coba ni kok masih tetep ya.

    ReplyDelete