Membuat Spoiler Buka Tutup di Blog

Membuat Spoiler Buka Tutup Di Blog - Spoiler biasanya ditemukan di forum - forum, yang berfungsi untuk menyembunyikan gambar, kode , link yang panjang dan besar. Saat tulisan " Show " di klik maka akan terlihat gambar, link, kode yang di sembunyikan. Tujuan memasang spoiler adalah untuk menghemat tempat pada postingan / tulisan.

Ini dia contoh Spoiler :

Habluez Share

Jika ingin memasang silahkan ikuti di bawah ini :


Kode Spoiler Text :

<div style="margin: 5px;">

<div class="smallfont" style="margin-bottom: 2px;"><input 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" value="Show" /></div>

<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px; background: #FAFAF7;">

<div style="display: none;">Masukan Disini</div>

</div>

</div>

*Ganti yang berwarna merah dengan isi spoilermu.



Kode Spoiler Gambar



<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><input 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" value="Show" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px; background: #FAFAF7;">
<div style="display: none;"><img class="aligncenter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfOSF2AAw_z_UX4D7mwat0V93lqWEFSU1rqpBqWn7ybM6EWr2ZRmV0ZZyn8OPv7-1Mk0mlWg7mKPEMVdz25YzgFz8brivbrYImQAyh4m_fPmrytI2wrEB7GK4Drm0RJ0GPVMC6E-C_M78/s1600/images.jpg" alt="monyet" width="300" height="280" /></div>
</div>
</div>

*Ganti yang berwarna merah dengan url gambar spoilermu.






Cara memasangnya :

Widget :

1. Login Blogger
2. Masuk ke Tata Letak >> Tambah Widget >> html Javascript
3. Masukan Code Tersebut

Posting : 


1. Login Blogger
2. Masuk ke buat posting
3. Taruh kode spoiler di HTML.
4. Terbitkan


Selamat mencoba. Tutorial ini sudah berhasil di coba. apabila tidak bisa mungkin anda salah mencopynya.. - Membuat Spoiler Buka Tutup Di Blog

Categories: Tutorial Blogger