Cara Membuat Widget Spoiler Show/Hide di Blog ~ febrian tkj blog

Spoiler atau disebut juga show hidden sering digunakan para bloger untuk meminimalis menu pada blog begitu pula saya juga sering menggunakan spoler show hiden agar tidak terlalu banyak menu yang di tampilkan. Saya akan memberikan tips untuk sobat bloger tentang cara membuat spoiler show hidden pada blog. Gk usah panjang lebar, langsung aja cek caranya seperti apa.

Caranya :

Copy code dibawah ini, paste-kan pada posting blog. INGAT! harus dalam keadaan HTML, bukan dalam keadaan COMPOSE.

<div><div style="margin-bottom: 2px;"><i><b><small>Klik untuk melihat </small></b></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button" /></div>

<div style="border:inset ; margin: 0px; padding: 6px;"><div style="display: none;">

PUT YOUR TEXT HERE

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

Keterangan:

Ganti kata yang berwarna Hijau dengan kata-kata sesuka Anda.
Letakkan teks Anda yang ingin di HIDE pada teks yang berwarna Biru.
Hapus code yang berwarna Merah untuk spoiler yang tanpa kotak.

Hasil Spoiler yang dengan kotak :

Klik untuk melihat

Hasil Spoiler yang tanpa kotak :

Klik untuk melihat

Nahh mudah bukan!

Tidak ada yang tidak sulit kalau kita mau berusaha

Terima kasih telah membaca artikel tentang Cara Membuat Widget Spoiler Show/Hide di Blog di blog febrian tkj blog jika anda ingin menyebar luaskan artikel ini di mohon untuk mencantumkan link sebagai Sumbernya, dan bila artikel ini bermanfaat silakan bookmark halaman ini di web browser anda, dengan cara menekan Ctrl + D pada tombol keyboard anda.

Cara Membuat Widget Spoiler Show/Hide di Blog

Artikel terbaru :