Sudah tahukah sobat apa itu spoiler ?
Kalau kita terbiasa baca thread-thread di forum Kaskus.co.id, maka disitu akan banyak kita jumpai istilah Spoiler. Para Kaskuser menggunakan Spoiler untuk menyembunyikan sebagian atau seluruh konten, baik itu berupa teks, gambar, animasi ataupun video.
Lalu bagamana cara menerapkannya di blog ??
Sedikit akan saya uraikan fungsi dari spoiler ini.
Bisa dikatakan bahwa fungsi dari spoiler yaitu menghemat tempat [space], mengurangi waktu load konten pada blog [karena konten yang berat seperti gambar dan video tidak diaktifkan sebelum menekan tombol show], memberikan pilihan pada pengunjung blog untuk membuka atau tidak isi spoiler.
Berikut ini kode yang digunakan untuk membuat spoiler pada blog atau postingan:
<div><div style=”margin: 5px;”>
<div class=”smallfont” style=”margin-bottom: 2px;”><i><span style=”font-weight: bold;”>Tulis aja sekenanya </span></i><input value=”Show” style=”margin: 0px; padding: 0px; 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 class=”alt2″ style=”border: 1px inset ; margin: 0px; padding: 6px;”>
<div style=”display: none;”>
isi tulisan spoiler…
</div></div></div></div>
Hasilnya seperti dibawah ini:
Kode :
Hasil tempilan:
Silahkan ganti beberapa teks seperlunya.
Kalau sobat blogger sudah terbiasa mengotak-atik kode HTML, bisa modif sendiri.
Spoiler ini bekerja pada platform Blogspot, dan tidak bisa diterapkan pada WordPress 🙂