Cara Membuat Spoiler Di Blog

Memenuhi request dari sahabat Shinta yang kemarin bertanya tentang bagaimana membuat spoiler, kali ini saya memenuhinya karena kemarin saya juga sudah berjanji hari ini saya akan membuat postingan yang membahas "Cara Membuat Spoiler Di Blog". Sebagian besar dari Sobat mungkin sudah tahu spoiler itu apa?. Spoiler yaitu cara yang digunakan untuk menyembunyikan sesuatu yang kita inginkan. Biasanya ini dilakukan untuk memperingan blog kita. Postingan kali ini juga tulisan pertama saya setelah ganti template.

Cara ini bisa digunakan untuk menyembunyikan teks biasa, kode html, gambar, musik, video dan sebagainya. berikut ini adalah contoh dari spoiler :


ISI DENGAN TEKS, GAMBAR, MUSIK, VIDEO DAN SEBAGAINYA

Untuk membuatnya, silahkan copas kode berikut :
<div style="margin: 5px 20px 20px;"><input value="Buka" style="margin: 0px; padding: 0px; width: 60px; font-size: 12px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Tutup&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Buka&#39;; }" type="button" /> </div><br /><div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;"><div style="display:none;"> ISI DENGAN TEKS, GAMBAR, MUSIK, VIDEO DAN SEBAGAINYA SESUAI DENGAN KEINGINAN SOBAT</div></div>


Cara Membuat Spoiler Di Blog Rating: 4.5 Diposkan Oleh: muzzy musthofa

46 komentar:

  1. Terima kasih tutorialnya.

    Salam ukhuwah

    BalasHapus
  2. wih kedua berhasil diamankan,,nice inpoh gan,,xixixixi :13

    BalasHapus
  3. keren sob asrtikelnya
    lam blogger uga yaw

    BalasHapus
  4. wwhhheeeww, thank you so much,, lihat postingan terbaru ku deh,, aq udah pake untuk nge-hide picture,, thanx alot,,

    muzzy, your link is on my blog, check it on "visit here"

    BalasHapus
  5. info yang sangat bermanfaat spoiler ....terima kasih

    BalasHapus
  6. Terimakasih Tutor2nya
    Sukses ya..

    BalasHapus
  7. kalo pake wordpress gimana bisa gak gan?

    BalasHapus
  8. @optimasi SEO : yang saya tahu, biasanya wordpress biasanya tidak bisa dikasih kaya gini....

    BalasHapus
  9. another collection of knowledge here :)

    BalasHapus
  10. keren sob juga aq tempatkan di sidebar blog aq

    BalasHapus
  11. Wah, kalau cara seperti itu, berarti harus terus mengetik kode HTML nya dong mas :58

    Kira-kira ada nggak cara seperti yang ada di Kaskus jadi tinggal menuliskan tag-tag html khusus saja.

    yo mastah, pasti bisa kan, :38

    BalasHapus
  12. @ Pintu Kaya : wah kalau dengan cara lain, saya belum tahu kawan. kalau pake ini kan tinggal copas aja kodenya

    BalasHapus
  13. makasih sob infonya... aku baru tau nich maklum baru belajar ngeblog

    BalasHapus
  14. Mak nyus kawan.spoiler make beautiful

    BalasHapus
  15. kaLo yang ini beLum mudeng ach, hehehe.
    trims u/ jawaban dari pertanyaan ku yg kemarin

    BalasHapus
  16. infonya diterima dengan baik :)

    BalasHapus
  17. Halo Salam Kenal,,,Terimakasih Atas TutorialNya. Blog Anda Bagus, Manstab. Berkunjung Balik ya ???


    Salam,

    [rifweb]

    BalasHapus
  18. Trims infonya, saya pingin nyoba deh...

    BalasHapus
  19. Wah aku ga terlalu suka pake spoiler Sob hhe.....tp makasih info'y......

    BalasHapus
  20. Thx sob, tambah ilmu lagi nih ... jangan lupa mampir ke blogku lagi .. :33

    BalasHapus
  21. Nice, ilike it. Thank bos atas kunjungannya ke http://fadhilgalery.blogspot.com

    BalasHapus
  22. terima kasih atas berbagi ilmunya,,ini mantap sob

    BalasHapus
  23. Wah, trims untuk postingannya. Saya nyari ini sejak dulu.

    Saya izin nyomot kodenya, sekalian izin follow blognya :)

    BalasHapus
  24. kok gw msh bingung yah hehe

    BalasHapus
  25. Good posting sobat thanks for sharing

    BalasHapus
  26. mantap sob, bisa dicoba tuh...

    BalasHapus
  27. Nice Post.. thanks.. senior..

    BalasHapus
  28. wew,,,,tutorial yg menarik....
    thanks ya...

    BalasHapus
  29. Terima kasih tutorialnya, :33
    salam kenal. :)

    BalasHapus
  30. makasih atas tipsnya dapat menghemat tempat.

    BalasHapus
  31. salam sahabat
    ehm this good posting n make me know more getting info..oh ya dah saya follow anda udah kan???thnxs n good l;uck

    BalasHapus
  32. tutorial yang sangat bermanfaat.. makasih sobat

    BalasHapus
  33. Wah bagus triknya mas.. Keep blogging!

    BalasHapus
  34. Wahhhhh... ini dia nih yang aku cari2 dari dulu. hehehe

    sangat berguna.

    makasih infonya... :D

    BalasHapus
  35. maksih sob..infonya..udah aku pake di blogku...sukses y sob...

    BalasHapus
  36. Wah ide yang bagus gan, alangkah baiknya dikombinasikan dengan fitur image lazy load seperti di blog saya. Alisaptamarza. Efek dari image lazy load adalah, setiap image yang ada dalam setiap postingan akan di load ketika user berada pada posisi image, jika user belum berada diatas posisi image, image tidak akan di tampilkan. berikut cara menambahkan fitur blog pada blog anda,, Menambahkan Image Lazyload ke dalam blogger

    BalasHapus
  37. mau nyoba ah..
    mantap..
    sukses selalu. :10

    BalasHapus
  38. itu taruh nya dimana? di java?
    maaf saya pemula :14

    BalasHapus

Silahkan Sobat semua komentar disini. Segala kritik dan saran dari Sobat semua akan sangat berguna bagi kemajuan blog ini.