Ada tiga pola situasi yang cocok untuk menerapkan teknik spoiler ini.
1. untuk situs atau blog yang banyak berisi pertanyaan dan tanggapan (Q&A), menyerupai situs akademis (pelajaran) atau teka-teki, di mana tanggapan gres akan terbuka sesudah tombol spoiler di klik.
2. jikalau kita ingin posting banyak gambar dengan ukuran besar (istilah gaul-nya BWK/bandwidth killer), namun tidak ingin gambar tersebut dimunculkan dahulu, untuk menghemat bandwidth. Kaprikornus gambar gres akan terbuka jikalau pembaca memang ingin melihatnya dan meng-klik tombol spoiler.
3. jikalau kita ingin menulis sebuah resensi film atau buku, namun tidak ingin membuka alur dongeng bagi pihak-pihak yang belum menonton film atau membaca bukunya, maka kita dapat menyembunyikan goresan pena yang berisi plot ini dan menamai tombolnya dengan goresan pena spoiler alert.
Adapun pola dari tombol spoiler tersebut yakni menyerupai di bawah ini :
Kode markup yang diharapkan :
<button title="Cara Memasang Spoiler di Blog" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">Spoiler</button> <br/> <div id="spoiler" style="display:none"> ISI SPOILER YANG HENDAK DISEMBUNYIKAN </div>
Kode di atas dapat dipakai baik untuk postingan pada Blogger/Blogspot maupun pada WordPress. Perlu diingat bahwa isyarat perlu dimasukkan di area HTML (Blogger) atau Text (WordPress) pada kolom posting, bukan pada area Compose (Blogger) atau Visual (WordPress).
Setelan :
- Jika anda ingin memasang tombol spoiler lebih dari satu pada halaman yang sama, anda perlu menamainya dengan ID yang berbeda-beda. Ganti goresan pena spoiler pada isyarat di atas dengan ID unik, contohnya spoiler01, spoiler02, dst…
- Spoiler yakni teks yang muncul di tombol. Bisa anda ganti dengan goresan pena lain sesuka hati.
- Tombol dapat anda ganti dengan gambar yang anda inginkan. Caranya ganti semua isyarat yang terletak di atas <br/> dengan :
<img src="IMAGE_URL" title="Cara Memasang Spoiler di Blog" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}"/>
di mana IMAGE_URL yakni direct link ke lokasi gambar anda.
Demikianlah Cara Memasang Spoiler di Blog Blogger dan WordPress. Semoga bermanfaat.
0 Response to "Cara Memasang Spoiler Di Blog"
Post a Comment