Spoiler ini berguna untuk menyembunyikan text, kode, kalimat ataupun gambar maupun video dalam postingan blog. spolier ini berguna untuk menghemat ruang dalam sebuah postingan blog serta untuk membuatnya kelihatan lebih rapi. namun spoiler bukan hanya berguna dalam postingan blog, namun juga berguna untuk widget side bar atau lainnya dalam blog
Berikut contoh spoiler
Klik Show Untuk Membuka Spoiler
untuk contoh diatas berikut ini adalah kodenya :
<div style="margin-bottom: 2px;">Klik Show Untuk Membuka Spoiler
<div style="margin-top: 5px; text-align: center;"><input value="Show" style="margin-top: 5px; width: 60px; font-size: 10px;" 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"> </div>
<div style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;">Memasang spoiler di blog sangat mudah Inilah kode untuk membuat spoiler dengan teks </div></div></div>
keterangan : yang berwarna biru ubahlah dengan text yang kamu suka
yang berwarna merah bisa kamu ganti dengan judul yang ingin berikan
2. memasang spoiler untuk gambar atau hal lain
contohnya :
Spoiler :
Berikut untuk kode contoh tersebut :
<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;">
<b>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;">
<img src="http://i1311.photobucket.com/albums/s675/one7die/cth_zpsdd760d2b.jpg" border="0" alt="Post spoiler"></div>
</div>
</div>
keterangan : yang berwarna Merah merupakan kode URL gambar atau image yang Kamu punya..
Sekian.. dan selamat mencoba.