Cara Buat Spoiler Pada Blog

Cara Buat Spoiler Pada Blog - Spoiler berfungsi untuk menyembuyikan gambar, teks, atau bahkan video pada blog. Spoiler juga bermanfaat agar konten yang berat seperti gambar dalam ukuran besar dan video tidak diload sebelum menekan tombol buka. Tentu saja bermanfaat karna akan membantu mengurangi beban loading blog kita .  

Cara Buat Spoiler Pada Blog : 
Jika ingin membuat Spoiler di postingan pilih Edit HTML bukan Compose setelah beberapa script di bawah ini di pastekan di Edit HTML baru klik Compose .

<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">JUDUL SPOILER</span></i><input value="BUKA" style="margin: 0px; padding: 0px; width: 60px; " 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 = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" type="button"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

ISI SPOILER ANDA

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

Hasilnya akan seperti ini :

JUDUL SPOILER

ISI SPOILER ANDA

Kalau yang ini yang tanpa judul.

<div><div style="margin: 5px;">
<div class="bigfont" style="margin-bottom: 2px;"><input value="BUKA" style="margin: 0px; padding: 0px; width: 60px; " 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 = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

ISI SPOILER ANDA

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

Hasilnya akan seperti di bawah ini :

ISI SPOILER ANDA

Untuk tulisan buka tutupnya bisa anda ubah sesuai selera ,dan jangan lupa ganti tulisan "isi spoiler anda" dengan gambar,teks, atau video anda .
Semoga bermanfaat.