Cara Menghasilkan Spoiler Di Blogger/Blogspot

Posted by seni belajar at 9:36 AM

Tips dan trik menghasilkan spoiler ini bahu-membahu telah banyak yang posting dan share. Akan tetapi, tidak ada salahnya juga jikalau saya ikut share wacana spoiler dan sedikit wacana kegunaannya.

Spoiler dibentuk dengan menggunakan javascript button. Sedangkan untuk menyembunyikannnya digunakan properti CSS display, dalam hal ini, "display:none;". Fungsinya ada banyak sekali, diantaranya untuk memperpendek teks atau gambar yang sungguh besar/panjang dan menyantap space halaman atau untuk menyembunyikan kejutan bagi hadirin (maka sering kali disebut pula selaku "peek-a-boo", Indonesianya kurang lebih, "ci-luk-ba!", hehe)

Pada posting blog, spoiler sanggup digunakan untuk memperpendek panjang halaman sementara sebelum di-klik oleh pengunjung, sehingga terlihat tidak ruwet.

Spoiler juga sanggup digunakan untuk menghibur hadirin juga loh, umpamanya seumpama ini:

Cara menghasilkan dan memasang spoiler di Blogger/Blogspot:

1. Copy dan gunakan script berikut:

<div id="spoiler" style="display:none">
Konten Yang Disembunyikan
</div>
<button title="Cara Membuat Spoiler di Blogger/Blogspot"color: red;">Klik untuk melihat/menyembunyikan" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">Buka/Tutup</button>

Kostumisasi spoiler:

- Ganti Konten Yang Disembunyikan dengan konten (text, url, url gambar, script dll) yang ingin disembunyikan.

- Ganti title Klik untuk melihat/menyembunyikan dengan title sekehendak anda. Title berfungsi memberi gunjingan dikala mouse di hover di atas tombol spoiler.

- Ganti Buka/Tutup dengan teks sesuai keinginan, teks tersebut akan menjadi perintah yang terlihat pada tombol spoiler.

2. Untuk menghasilkan spoiler di tubuh posting, buat spoiler lewat sajian Edit HTML, letaknya dibagian pojok kanan atas kotak posting, semua editing dilaksanakan pada sajian tersebut, jikalau tidak maka script tidak akan bekerja.

3. Jika ingin menjadikannya di widget, pilih sajian "HTML/Javascript".

Javascript Widgets