Membuat Spoiler Di Blog

Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari konten. Spoiler juga bermanfaat agar konten yang berat seperti gambar dalam ukuran besar dan video tidak diload sebelum menekan tombol show. Dengan kata lain spoiler membantu kita mengurangi waktu load konten blog dan memberikan pilihan kepada pembaca blog untuk membuka atau tidak isi spoiler.

Anda sudah sering lihat Spoiler di kaskus atau forum-forum untuk sembunyikan gambar, link dan konten lainnya. Spoiler ada dua yaitu untuk forum misalnya kaskus dan satunya lagi untuk dipergunakan diblog/web. Keduanya memiliki kode yang berbeda.

• Spoiler Forum Kode HTMLnya:
[spoiler=judul spoiler]isi spoiler[/spoiler]

Ganti tulisan yang berwarna merah sesuai judul dan isi spoiler yang anda kehendaki.

• Spoiler untuk blog/web:
Menyembunyikan konten tertentu dari sebuah halaman blog/website diperlukan untuk menghemat space. Ketika visitor ingin melihatnya mereka dapat dengan mudah menampilkannya. Begitupun dalam software forum semacam vBulletin, Spoiler pasti banyak digunakan.

Berikut kode yang bisa digunakan dalam membuat spoiler di blog :

<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Tentang Spoiler Blog </span></i><input value="Show" 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 = 'Hide'; } 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...

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

kode diatas akan menghasilkan seperti di bawah ini:

Tentang Spoiler Blog

isi spoiler...