Cara Menciptakan Dan Memasang Spoiler Di Blog

Cara Membuat dan Memasang Spoiler di Blog

Teman teman kali ini saya ingin mengembangkan Cara Memasang Spoiler atau Buka Tutup pada postingan blog ibarat ini biasanya ditemukan di forum-forum tujuannya untuk menghemat daerah atau untuk memperindah tampilan blog, spoiler sahabatnya scrool. Untuk menciptakan spoiler tidak lah sulit.

Contoh Spoiler di blog:


Contoh Spoiler Keren perihal Yoyo Apriyanto: 

Contoh Spoiler:

Cara Membuat Spoiler di Postingan Blog:


   1. Login ke akun blogger anda
   2. Pilih Entri Baru/New Post
   3. Lalu pilih mode Edit HTML
   4. Copy paste isyarat di bawah ini kemudian taruh pada mode Edit HTML


<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</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;">
Tuliskan Teks Anda di Sini atau isyarat script gambar/video ! <br>
</div>
</div>

</div>


   5. Simpan







Cara Membuat Spoiler di Widget Blog:


1.    Login ke Akun Blogger anda
2.    Masuk ke hidangan tata letak
3.    Klik tambah widget kemudian pilih HTML javascript
4.    Copy Paste isyarat di bawah ini

<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</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;">
Tuliskan Teks Anda di Sini atau isyarat script gambar/video ! <br>
</div>
</div>

</div> 


4.    Simpan

*) Ganti goresan pena yang berwarna merah sesuai harapan Anda


Semoga bermanfaat.