Cara Membuat Spoiler di Blog

Sobat mungkin tidak asing lagi dengan yang namanya spoiler. Spoiler biasanya dipakai untuk menyembunyikan gambar atau tulisan, saat klik tombol [open] baru tulisan atau gambar tersebut terbuka.

Spoiler berasal dari kata 'spoil'. Spoil adalah bahasa Inggris, terjemahan bahasa Indonesia-nya menurut Google Translate Spoil adalah merusak. Dalam bahasa Inggris, kata kerja yang ditambahi akhiran 'er' biasanya jadi objek pelaku. Jadi, Spoil=merusak maka Spoiler=perusak. 

Menurut ane sih gan disebut spoiler karena biasanya pelaku/pembuat spoiler bertujuan untuk menampilkan langsung isi/gambar yang bisa membuat jengkel pembuka spoiler tersebut. karena biasanya isi spoiler itu gambar tipuan / ngerjain dengan menampilkan gambar / teks yang tidak diinginkan sipembuka spoiler. jadi hati - hati ya kalo membuka spoiler, jangan ketipu dan langsung senang jika ada spoiler bisa saja akan membuat agan frustasi dan kecewa. :P

Dibawah ini adalah contoh spoiler.

 

dan hasilnya seperti ini :

Check It Out :

Lalu, bagaimana cara membuat spoiler di blog? baca dan praktikkan ya! :D

• Saat membuat postingan, pindah ke mode menulis HTML.
• Copy kode Spoiler berikut:

<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b> : <input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" style="font-size: 11px; margin: 0px; padding: 0px; width: 55px;" type="button" value="Open" /></div><div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px; text-align: left;"><div style="display: none;">

ISI SPOILER DISINI

</div></div></div>

• Paste di lokasi yang akan dipasangi spoiler.
• Ganti tulisan warna biru dengan judul spoiler yang diinginkan.
• Ganti tulisan warna merah dengan isi spoiler
• Isi spoiler gambar, kodenya <img src="lokasi_file-gambar" height="tinggi-gambar" width="lebar-gambar">

Demikian tutorial cara buat spoiler diblog seperti yang ada di Kaskus. Semoga bermanfaat.

Posted in: PERCANTIK BLOG