Cara membuat Spoiler [ show Hide ] pada postingan

Dah lama ANdava's gax Ngeposting Pernak-pernik Blog. sobat blogger semuanya, pastinya sudah tahu apa itu spoiler, apalagi yang sering main di forum tuh. Spoiler sudah pasti menjadi hal sering dipakai. Lalu kalau kita ingin menerapkannya di blog kita? emmmhh.. pastinya keren donk.

Sebelumnya kalau ada yang masih belum tahu, apa itu spoiler? Saya akan jelasin singkat saja.
==>> Spoiler adalah tombol yang diguanakan untuk menyingkat tempat atau menyembunyikan konten (teks, foto atau video) dengan klik untuk membuka dan menutup.

Contohnya bisa dilihat di bawah halaman ini :

Silahkan di Buka:

Orang Ini Cakeep Daak,.. !! hehee

Cara Membuat Spoiler Pada Postingan Blog :

1. Login ke Blogger
2. Pilih New Post atau Entri Baru seperti membuat postingan biasa
3. Pilihlah pada mode Edit HTML saat membuat postingan
4. Gunakan kode script berikut ini untuk membuat spoiler:

<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;">

Letakkan teks atau kode script (gambar atau video) di sini sob..!!

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

5. Kita dapat mengganti Judul Spoiler sesuai keinginan kita, begitu juga Buka dan Tutup.
6. Klik Publish atau Terbitkan Entri jika sudah selesai.

Semoga bermanfaat,.

Related Post:

Pernak-pernik blog

• Cara membuat Daun Bertebaran di blog
• Cara menghilangkan tulisan Subscribe To Post (Atom) Blog
• Cara mengecek kecepatan Blog
• Cara Memberi Background atau efek di judul posting
• Cara memasang Tombol Like Di atas Postingan
• Cara menghilangkan Tulisan " Tampilkan Entri Lawas "
• Cara membuat link otomatis saat artikel di copas di blogger
• Cara memasang Tombol 'Back To Top' di blog
• Cara medifikasi kotak komentar dengan Intensedebate
• Cara membuat Buku Tamu Tersembunyi di blog
• cara membuat effek zoom Gambar di Blog
• cara membuat player musik di blog melayang
• Jangan asal copy paste
• Cara Memasang, Menggunakan Gadget Freedjit dan Memanfaatkannya sebagai Media Analisis Blog Anda
• Cara mengganti Domain Blogspot.com menjadi co.cc
• Scripct animasi terbang di blog
• Cara membuat tag Cloud / Label cloud
• Cara membuat read more otomatis di blog
• Cara membuat google translate di blog
• Cara membuat Scroll pada Blog Archive
• Cara membuat Disable klik kanan
• Cara membuat pesan pembuka dan penutup di blog
• Cara membuat cursor bertaburan bintang