cara membuat spoiler dalam postingan blog

cara membuat spoiler dalam postingan blog

 Saya pengin posting yang berjudul cara membuat spoiler dalam postingan blog. Tombol spoiler atau bisa di sebut tombol buka dan tutup. Biasanya tombol spoiler ini dibuat dalam postingan blog yang banyak gambarnya, sperti blog tutorial. Karna tombol spoiler ini bisa untuk mempersingkat artikel atau bisa juga membuat irit ruang postingan blog. Jadi apabila artikel blog yang dibuat dengan gambar yang size nya besar atau memasang kode script yang sangat panjang, tidak akan membuat loading blog menjadi berat. Jadi postingan dengan gambar yang ukuran nya besar itu harus dipasang tombol spoiler supaya loading blog lebih ringan.

Untuk sobat blogger yang ingin membuat tombol spoiler di dalam postingan blog silahkan sobat coppy saja kode di bawah ini saat mau menulis artikel harus pada mode HTML bukan posisi Compose.

Silahkan sobat coppy kode script di bawah ini.

<div id="spoiler"> <div><input type="button" value="Coba Di Buka Sob" style="margin:0px; padding:0px;"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 = 'Ehh Jangan Lupa Di Tutup Lagi Sob'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1] .getElementsByTagName('div')[0] .style.display = 'none'; this.innerText = ''; this.value = 'Kalo Masih Penasaran Di Buka Lagi Sob'; }"> </div> <div style="background:#00ffff; margin:10px auto; border: 0px solid #000; padding: 5px;"> <div style="display: none;"> isi spoiler/isi gambar, dan bisa kode script </div></div></div>

NB: 

• Text yang ber warna Biru bisa soba ganti sesuka hati.  

•  Untuk yang warna Hijau adalah warna background, bisa sobat ganti sesuat keinginan.

•   Dan untuk yang warna Hitam adalah isi dari konten yang akan di sembunyikan / di buka dan tutup.

Contoh nya sperti ini.