Sebagian orang pastinya sudah tahu apa itu spoiler,
apalagi kalau sering bermain di forum. Spoiler sudah pasti sering
digunakan. Lalu bagaimana kalau mau menerapkan atau membuat spoiler di
blog? Sebelumnya kalau ada yang belum tahu apa itu spoiler. saya jelasin
singkat saja. Spoiler adalah tombol yang diguanakan untuk menyingkat
tempat atau menyembunyikan konten (teks, foto atau video) dengan buka
tutup. Contohnya bisa dilihat di bawah halaman ini.
Spoiler
bisa juga dibuat di blog, lebih khusus dipostingan. Biasanya
digunakan untuk membuat penasaran si pembaca dengan menyembunyikan
terlebih dahulu. Untuk melihatnya dengan mengklik tombol spoiler itu.
Selain itu juga untuk menghemat tempat, ya karena buka tutup itu
(spoiler). Lalu bagaimana cara membuat spoiler di blog? Langsung simak
yang berikut ini.
Cara Membuat Spoiler di Blog :
- Login ke Blogger
- Pilih New Post atau Entri Baru seperti membuat postingan biasa
- Pilihlah pada mode Edit HTML saat membuat postingan
- 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
<br>
</div>
</div>
</div>
<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>
5. Kita dapat mengganti Judul Spoiler sesuai kehendak kita, begitu juga Buka dan Tutup.
6. Klik Publish atau Terbitkan Entri jika sudah selesai.
Contoh :
Cewek Mainin Burung:
gi, klau mau masukkan teks yg mau dispoilerkan dmana gi?
BalasHapusitu ada bacaan Letakkan teks atau kode script (gambar atau video) di sini". disitu rif..
BalasHapus