Selamat Datang
blognyaipank

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 :






6 komentar:

kocak mengatakan...

keren sob.. bisa buat wordpress gak yah? kalo bisa kabarin ane yah :)

Thankssss

catur mengatakan...

bro, trus kalo mau masukin ke postingannya gimana caranya bro..?
pake kode itu juga...?
thanks...

my blog mengatakan...

thanks ya brada, blog u ngebantu w banget nih!, btw udah pernah ikut aplikasi bagi-on facebook lom?., nih gw bagi link nya!
http://apps.facebook.com/bagi-bagi/index.php?fuid=1717833527

Lukman bin Ma'sa mengatakan...

utuk memanjangkan kotaknya gimana ya

blognya ipank mengatakan...

@catur : iya sob..langsung dimasukin aja ke postingan..

blognya ipank mengatakan...

@Lukman bin Ma'sa: sob, aku coba uda otomatis panjangnya..sesuai isi konten.. :)

Posting Komentar

Silahkan meninggalkan komentar Anda, apabila Anda tidak ingin diketahui identitasnya, Anda bisa memberi komentar sebagai Anonim. komentar yang mengandung SARA tidak akan ditampilkan.