Cara Menciptakan Dan Memasang Spoiler Di Blog

Cara Membuat dan Memasang Spoiler di Blog

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

Contoh Spoiler di blog:


Contoh Spoiler Keren wacana 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 instruksi 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 instruksi script gambar/video ! <br>
</div>
</div>

</div>


   5. Simpan







Cara Membuat Spoiler di Widget Blog:


1.    Login ke Akun Blogger anda
2.    Masuk ke sajian tata letak
3.    Klik tambah widget kemudian pilih HTML javascript
4.    Copy Paste instruksi 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 instruksi script gambar/video ! <br>
</div>
</div>

</div> 


4.    Simpan

*) Ganti goresan pena yang berwarna merah sesuai harapan Anda


Semoga bermanfaat.