Spoiler dalam sebuah situs web atau blog berfungsi untuk menyembunyikan dan menampilkan baik itu tulisan, gambar, maupun video. Keuntungan lainnya menggunakan spoiler ini yaitu supaya blog kelihatan lebih simple sehingga tidak banyak menyita banyak space di postingan Anda.
Selain itu bermanfaat juga untuk mengurangi beban load blog, karena isi dari spoiler ini tidak akan di load sampai kita mengklik untuk menampilkanya.
Selain itu bermanfaat juga untuk mengurangi beban load blog, karena isi dari spoiler ini tidak akan di load sampai kita mengklik untuk menampilkanya.
Apabila masih penasaran bagaimana hasilnya, silahkan lihat yang dibawah ini
Contoh
Sebenarnya ada beberapa cara yang dapat digunakan untuk membuat spoiler ini. Kalau Anda tertarik untuk mencoba dan membuatnya, berikut admin akan berikan dua cara yang paling mudah. Tutorial lengkapnya ikuti cara berikut ini:
Cara Pertama
1. Masuk Dasbor Blogger.
2. Buat postingan baru.
3. Beralih dari tab Compose ke HTML.
4. Masukkan kode berikut:
[<div><div style="margin: 5px;">5. Silahkan masukkan konten yang akan disembunyikan dengan cara ganti tulisan berwarna merah.
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul</span></i><input value="Buka" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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;">
isi spoiler disini
</div></div></div></div>]
Cara Kedua
Setelah mengikuti cara 1 sampai 3 diatas, masukkan kode berikut:
[<div id="spoiler" style="display:none">
isi spoiler disini
</div>
<button title="Klik untuk buka/tutup" 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>]
Sekian tips dan trik blogging kali ini tentang cara membuat spoiler di blog atau website. Apabila ada pertanyaan seputar topik, silahkan tinggalkan komentar dan jangan lupa ikuti kami untuk mendapatkan informasi terbaru lainnya.
