Menggunakan tombol spoiler akan membantu sobat dalam membuat tampilan postingan menjadi lebih rapi. Terutama untuk menampilkan teks yang banyak, terkadang akan lebih baik untuk sedikit dirapikan dengan tombol spoiler ini.
Tombol spoiler ini sering digunakan pada forum thread kaskus. Kalau sobat sering bermain kaskus, pasti sudah tidak asing, bahkan sudah familiar.
Membuat spoiler di blog caranya berbeda seperti membuat spoiler di kaskus. Untuk membuat spoiler di blog, sobat memerlukan beberapa kode javascript dan html. Apabila sobat sudah penasaran dengan tombol spoiler yang saya maksud, sobat dapat melanjutkan membaca artikel ini.
Langsung saja, kalau sobat penasaran bagaimana contoh tombol spoiler, sobat melihat tombol di bawah ini
Untuk membuat spoiler ini tidaklah sulit. Yang perlu sobat lakukan adalah membuat sebuah posting artikel di blog sobat. Lalu sobat dapat memasukkan kode berikut di bagian artikel mana saja sobat menginginkannya.
<div id="spoiler">
<div>
<input style="padding:0px 10px; background:transparent; border:2px solid #2288cc; " 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 Lagi'; }" style="margin: 0px; padding: 0px;" type="button" value="Buka" />
</div>
<div style="background: transparent; border: 0px solid #000; margin: 10px auto; padding: 5px;">
<div style="display: none;">
Ini adalah isi spoiler<br/>
Ini juga isi spoiler<br/>
</div></div></div>
Masukkan kode di atas di bagian html saat membuat postingan baru. Lalu simpan dan klik preview untuk melihat apakah tombol spoiler ini sudah berfungsi dengan baik.
Ganti teks yang berwarna biru dengan teks sesuai keinginan sobat. Untuk mengganti baris, tambahkan kode <br/> setelah kalimat yang sobat tulis.
Demikian Cara Membuat Tombol Spoiler Pada Posting Blog. Semoga bermanfaat :)