Cara Membuat Spoiler/Tombol Buka Tutup Pada Posting Blog

Cara Membuat Spoiler/Tombol Buka Tutup Pada Posting Blog

Spoiler adalah suatu tombol yang segaja dibuat untuk menyembunyikan dan menampilkan konten gambar, teks, link, dan sebagainya.

Berikut ini beberapa manfaat dari Spoiler :

# Menghemat tempat
# Membuat orang penasaran apa yang ada di dalam Spoiler tersebut
# Postingan kita  tampil lebih Unik dan keren
# membuat loading lebih cepat/ringan jika isi posting kita terlalu panjang dan menggunakan gambar

Cara membuatnya ikuti langkah-langkah dibawah ini,

Copy kode dibawah ini

<div id="spoiler" style="display:none">
Konten yg ingin disembunyikan
</div>
<button title="Klik to open or close" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">Open/Close</button>

keterangan :
1. Ganti "Konten yg ingin disembunyikan"
    dengan konten (text, url, url gambar, script dll) yang ingin disembunyikan.
2. Ganti title "Klik to open or close" dengan title yg anda inginkan.
    Title berfungsi memberi informasi ketika mouse di hover di atas tombol spoiler.
3. Ganti "Open/Close" dengan teks sesuai keinginan,
    teks tersebut akan menjadi perintah yang terlihat pada tombol spoiler.

Untuk membuat spoiler di dalam posting, buat spoiler melalui menu Edit HTML, letaknya dibagian pojok kanan atas kotak posting.
semua editing dilakukan pada menu tersebut, jika tidak maka script tidak akan berfungsi.

lihat contoh dibawah ini :

klik untuk membuka tombol diatas...dan klik lagi untuk menutupnya kembali

Cara Membuat Spoiler/Tombol Buka Tutup Pada Posting Blog
Selamat Mencoba....Semoga Berhasil