Memasang spoiler pada blog

Kali ini blognyaipank mau bagi-bagi tips cara memasang spoiler pada blog. udah pada tahu belum spoiler itu apa? spoiler merupakan suatu widget yang berbentuk show/hidden. jadi suatu objek bisa ditayangkan atau disembunyikan. objeknya bisa berbentuk gambar maupen tulisan.. widget spoiler ini juga dapat meringkas tempat di blog kawan..hehe..langsung aja ke contohnya :

KONTEN KALIAN DISINI

Udah pada tahukan? widget seperti ini namanya spoiler..hehe.. sekarang langsung aja ke cara buatnya.

1. Menu Dashboard, klik Tata Letak, klik Tambah Gadget, HTML/Javascript.
2. masukkan kode berikut ini:

<div><div style="margin: 20px; margin-top:5px"><div style="margin-bottom: 2px;" class="smallfont"><input style="margin: 0px; padding: 5px; width: auto; " value="Show" 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 = 'Hidden'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/></div><div class="alt2"><div style="display: none;"><div style="border: none; color:none; background-color:none; text-align: justify; padding:10px;">

KONTEN KALIAN DISINI

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

3. Klik Simpan.

Keterangan :
1. kode yang berwarna merah (style italic/miring) harus sama. kode ini sebagai judul tombol. kalian bisa mengganti judulnya.
2. kode yang berwarna merah (tanpa style italic/miring) adalah kode untuk judul tombol. kalian bisa menggantinya.
3. kode yang berwarna hijau adalah kode untuk mengganti warna. kalian bisa menggantinya.
4. kode yang berwarna biru adalah isi konten di dalam spoiler, kalian bisa menngantinya sesuai kebutuhan kalian.


gampang kan sobat?hehe..selamat mencoba kawan..hehe..

preview spoiler :