Cara Membuat Spoiler di Blog

Membuat Spoiler di Blog
Bagi anda yang aktif  di forum pasti sudah tidak asing lagi dengan spoiler, karna hampir pasti semua forum pasti ada spoiler. Spoiler adalah posting konten (teks, foto atau video) tersembunyi yang bisa dilihat apabila pembaca meng-klik tombol dan pembaca juga bisa menyembunyikan kembali posting dengan menekan ulang tombol tersebut.

Spoiler ini sangat berguna sekali, karena fungsinya bisa menghemat ruang pada postingan, menghemat kuota pembaca serta bisa mempercepat loading halaman blog anda.

Judul Spoiler:
Banyak baca banyak tau :D


Jadi bagi anda yang belum tau cara membuat spoiler pada postingan blog bisa mengikuti langkah-langkah berikut ini.

1. Buat postingan terbaru seperti biasa
2. Kemudian Pilih tab HTML dan paste kode berikut

<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
 <br>
</div>
</div>
</div>

3. Anda bisa mengganti tulisan warna biru sesuai keinginan
4. Pada tulisan warna merah, silahkan isi dengan konten anda, baik itu teks biasa, kode, ataupun lainnya.
5. Kemudian klik publikasi jika sudah selesai.
Load disqus comments

0 komentar