Membuat Tombol Buka Tutup/Spoiler

Dalam kesempatan ini saya akan membagi informasi cara membuat tombol buka tutup istilah tren dalam dunia blog atau web adalah spoiler, mungkin istilah tersebut sudah tidak asing lagi. Spoiler adalah script atau kode baris perintah yang dapat menampilkan dan menyembunyikan tombol bila di klik akan terbuka menu baru. Pada umumnya tujuan dari pembuatan spoiler digunakan untuk menyembunyikan isi posting yang akan di panjang atau berupa script video dan gambar yang terlalu memakan tempat sehingga dapat menghemat.
Cara membuat spoiler tidak begitu rumit, anda hanya cukup memasukkan kode di bawah ini di setiap halaman posting. Lansung lihat contoh dibawah.

Judul Spoiler:

Wee....ternyata ada gambar cewek seksi, lihat sampe puas karna kesempatan hanya datang sekali saja bukan dua kali maka manfaatkan waktu anda dengan baik, oh ternyata cewek cantik ini termasuk dalam kategori spoiler "ternyata oh ternyata' sabar ya mau bikin kopi dulu. bersambung sejenak..... Oke lanjut lagi...hehe

Untuk memasukkan tombol spoiler kedalam postingan anda silahkan copy kode script berikut: 

<div style="margin: 5px 20px 20px;"> <div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" 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;"> Disini tempat anda meletakkan teks atau kode script gambar dan video anda <br> </div> </div> </div>

Cacatan:

• Tulisan yang berwarna merah silahkan anda ganti sesuai keinginan anda, boleh ganti dengan tulisan apa saja, Contoh diatas Judul Spoler Misalnya ganti dengan Photo saya, Buka ganti dengan Open, Tutup ganti dengan Close, yang dimaksud.

• Update : Ganti Tulisan Disini tempat anda meletakkan teks atau kode script gambar dan video anda dengan teks atau kode script yang akan anda pasang.

• Update : kode scrpt tersebut untuk deletakkan pada halaman posting.

Wah ternyata Cara Membuat Tombol Buka Tutup/Spoiler ini sangat mudah, Semoga bermanfaat. Sekian dan terima kasih.