Disain Grafis, Tips dan Triks

Cara Membuat Spoiler Di Dalam Postingan Blog dengan Mudah



Cara Membuat Spoiler Di Dalam Postingan Blog dengan Mudah


Tips blogspot mengenai cara membuat spoiler di postingan blog merupakan cara efektif untuk menghemat ruang posting sehingga artikel yang ditulis begitu panjang tidak sampai melorot ke bawah. Atau jika didalam postingan blog memasang gambar yang berukuran besar maka perlu dipasang tombol spoiler supaya loadingnya cepat apabila pembaca blog membuka artikel yang memasang gambar besar akan cepat terbuka jadi tidak harus menunggu lama. Tombol spoiler disebut tombol buka tutup dan banyak dipasang pada artikel blog agar terlihat lebih rapi.

Baca juga : Cara Membuat Gambar Membesar di dalam Postingan Blog

Cara Memasang Tombol Spoiler pada Postingan Blog
Agar tombol spoiler yang akan dipasang di artikel blog bisa bekerja maka untuk membuat spoiler tersebut disaat anda menulis artikel/postingan blog harus mode HTML (bukan Compose).

Untuk kode Tombol Spoiler seperti dibawah ini

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>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 GAMBAR ANDA ATAU KODE APA SAJA DISINI

</div>
</div>
</div>
</div>

Keterangan :
Misalnya anda menulis artikel tentang "Cara membuat blog di blogspot". Penulisan tersebut ditulis seperti biasanya yaitu pada mode Compose dan untuk memberi tombol spoiler yang anda lakukan yaitu klik mode HTML lalu pasang kode yang pertama diatasnya dan pasang kode yang ke dua yaitu kode </div> dibawah tulisan Cara membuat blog di blogspot, cukup paham bukan?

Cara Membuat Spoiler Di Dalam Postingan Blog dengan Mudah