Cara Membuat Spoiler Buka Tutup Di Blog

Spoiler pada blog adalah sebuah format bingkai yang digunakan untuk membingkai atau menyembunyikan teks, gambar, video maupun apa saja agar bisa disembunyikan di blog. Nantinya pengunjung bisa melihat isi spoiler tersebut dengan cara meng-klik tombol buka tutup atau "Show-Hide".

Spoiler ini bermanfaat untuk meringankan loading blog. Jika anda mengupload banyak gambar di postingan, maka anda sebaiknya memasukkan gambar-gambar tersebut ke dalam spoiler agar loadingnya blog menjadi ringan. Selain itu postingan anda akan tampak praktis dan keren.

Contoh spoiler bisa anda lihat dibawah ini;

elly tran ha:

<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;"><b>reffanet1.blogspot.com</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;"> Teks atau Kode Script (gambar/video) </div></div></div>

Cara memasangnya;
 1. Upload gambar di entry baru seperti biasanya.
 2. Setelah gambar terupload, buka HTML di entry baru (bukan Compose)
 3. Kemudian letakkan kode spoiler di tempat yang anda kehendaki, lalu pindahkan script gambar yang telah anda upload tadi ke tengah spoiler.
Contohnya bisa anda lihat dibawah ini;

<div class="separator" style="clear: both; text-align: center;"><a href="http://reffanet1.nlogspot.com" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="300" src="http://dc506.4shared.com/img/Awih8PhD/s3/124a4801988/Elly_Tran_Ha-7.jpg" width="400" /></a></div>

Untuk memasangnya di sidebar; Anda tinggal pastekan kode spoiler beserta sript gambar atau video di gadget HTML, lalu tempatkan di sidebar. Namun anda harus menyesuaikan ukuran lebar gambar atau video lebih dulu agar sesuai dengan lebar sidebar anda.
Semoga bermanfaat guys...
Klu masih bingung komen dibawah.