Cara Gampang Memasang Spoiler Di Blog Dengan Html
Cara Praktis Memasang Spoiler di Blog Dengan HTML - Pada kesempatan kali ini aku akan membahas seputar HTML yaitu bagaimana cara memasang spoiler di blog dengan arahan HTML , tentu disini juga kita akan berkaitan dengan HTML . Bagi anda yang suka beraktivitas di forum-forum internet menyerupai KASKUS niscaya sudah familiar dengan spoiler. Fitur ini berfungsi untuk menyembunyikan bab tertentu dari sebuah tulisan, sanggup juga berisi gambar, yang gres akan muncul sesudah tombol spoiler di klik.
Disini ada 3 contoh situasi yang cocok untuk menerapkan teknik spoiler ini sebagai berikut.
1. Untuk situs WEB atau BLOG yang berisi pertanyaan dan tanggapan Q&A, menyerupai situs akademis (pelajaran) atau teka-teki, dimana tanggapan gres akan terbuka tombol spoiler di klik.
2. Jika anda ingin memposting banyak gambar dengan ukuran besar dalam istilahnya BWK/bandwidth killer), namun tidak ingin gambar tersebut munculkan terlebih dahulu, untuk menghemat bandwidth. Makara gambar gres akan terbuka bila pembaca memang ingin melihatnya dan meng-klik tombol spoiler ini.
3. Jika anda ingin menulis sebuah resensi film atau buku, namun tidak ingin membuka alur dongeng lagi bagi pihak-pihak yang belum menonton film atau membaca buku, maka kita sanggup menyembunyikan goresan pena yang berisi plot ini dan menamai tombolnya dengan goresan pena spoiler alert.
Nah itulah 3 teladan situasi yang cocok untuk menerapkan teknik spoiler, selanjutnya kita eksklusif ke tutorial bagaimana cara memasang spoiler di blog dengan HTML sebagai berikut.
Kode di atas sanggup dipakai baik untuk postingan pada Blogger/Blogspot maupun pada platform WordPress . Perlu diingat bahwa arahan perlu dimasukkan di area HTML (Blogger) atau Text (WordPress) pada kolom postingan, bukan pada area Compose (Blogger) atau Visual (WordPress).
Untuk demo script diatas anda sanggup mengklik tombol dibawah ini.
Untuk setelan atau option sanggup diikuti langkah berikut ini.
Terakhir ganti URL Gambar Anda, ganti dengan gambar anda.
Nah mungkin demikian artikel wacana HTML bagaimana cara memasang/membuat spoiler di blog dengan HTML, agar apa yang aku sampaikan ini sanggup bermanfaat bagi anda dan menjadi materi pembelajaran. Apabila anda masih galau dengan tutorial diatas silahkan bertanya lewat berkomentar dibawah postingan ini.
Disini ada 3 contoh situasi yang cocok untuk menerapkan teknik spoiler ini sebagai berikut.
1. Untuk situs WEB atau BLOG yang berisi pertanyaan dan tanggapan Q&A, menyerupai situs akademis (pelajaran) atau teka-teki, dimana tanggapan gres akan terbuka tombol spoiler di klik.
2. Jika anda ingin memposting banyak gambar dengan ukuran besar dalam istilahnya BWK/bandwidth killer), namun tidak ingin gambar tersebut munculkan terlebih dahulu, untuk menghemat bandwidth. Makara gambar gres akan terbuka bila pembaca memang ingin melihatnya dan meng-klik tombol spoiler ini.
3. Jika anda ingin menulis sebuah resensi film atau buku, namun tidak ingin membuka alur dongeng lagi bagi pihak-pihak yang belum menonton film atau membaca buku, maka kita sanggup menyembunyikan goresan pena yang berisi plot ini dan menamai tombolnya dengan goresan pena spoiler alert.
Nah itulah 3 teladan situasi yang cocok untuk menerapkan teknik spoiler, selanjutnya kita eksklusif ke tutorial bagaimana cara memasang spoiler di blog dengan HTML sebagai berikut.
Kode HTML :
<button title="Cara Praktis Memasang Spoiler di Blog Dengan HTML" 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 KATA/GAMBAR DALAM SPOILER YANG HENDAK DISEMBUNYIKAN </div> Kode di atas sanggup dipakai baik untuk postingan pada Blogger/Blogspot maupun pada platform WordPress . Perlu diingat bahwa arahan perlu dimasukkan di area HTML (Blogger) atau Text (WordPress) pada kolom postingan, bukan pada area Compose (Blogger) atau Visual (WordPress).
Untuk demo script diatas anda sanggup mengklik tombol dibawah ini.
Untuk setelan atau option sanggup diikuti langkah berikut ini.
- Jika anda ingin memasang tombol spoiler lebih dari satu pada halaman yang sama, anda perlu menamainnya dengan ID yang berbeda-beda. Ganti goresan pena spoiler pada arahan diatas dengan ID unik, contohnya spoiler01, spoiler02, spoiler03, dan seterusnya.
- Spoiler merupakan teks yang muncul di tombol. Bisa anda ganti dengan goresan pena lain sesuai selera anda.
- Tombol sanggup anda ganti dengan gambar yang anda inginkan. Caranya ganti semua arahan yang terletak diatas. </br > dengan :
<img src="URL Gambar Anda" title="Cara Praktis Memasang Spoiler di Blog Dengan HTML" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}"/> Terakhir ganti URL Gambar Anda, ganti dengan gambar anda.
Nah mungkin demikian artikel wacana HTML bagaimana cara memasang/membuat spoiler di blog dengan HTML, agar apa yang aku sampaikan ini sanggup bermanfaat bagi anda dan menjadi materi pembelajaran. Apabila anda masih galau dengan tutorial diatas silahkan bertanya lewat berkomentar dibawah postingan ini.