Pembahasan kali ini mengenai cara memasang tombol spoiler di dalam postingan blog. Dengan memasang spoiler atau tombol buka tutup pada postingan akan membuat irit ruangan postingan yang terlalu banyak / terlalu panjang sehingga tidak membuat loading terlalu berat apalagi postingan dengan menyertakan gambar dengan resolusi besar.
Cara Membuat Tombol Buka Tutup Di Dalam Postingan Blog :
Terlebih dahulu anda buat suatu artikel dan cara memasang tombol spoiler (open and close) didalam postingan harus dalam posisi HTML (bukan Compose), dan kodenya 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;">
Tempat meletakkan gambar atau kode html
</div></div></div></div>
Keterangan :
Teks warna merah silahkan diisi dengan gambar atau lainnya
Contohnya spoiler seperti ini :
Spoiler :
Related Posts
tutorial blog
- How to Use Pokespy
- Cara Membuat Link Download dari MediaFire
- Menambah Elemen Sidebar Sebelah Kiri di Blogspot
- Cara Mendaftar Blog ke Dmoz
- Begini Cara Daftar Blog di Technorati
- Cara Claim Token Di Technorati
- Menyembunyikan Titel Blog Untuk Diganti Logo Di Header
- Membuat Header dan Menu Navigasi Tidak Bergerak (Tetap Diatas)
- Membuat Ruang Posting Blog Menjadi 2 Kolom Di Homepage
- Static Pages Blogger Bermasalah? Solusinya Begini
- Memasang Widget Cek No Resi JNE, TIKI, Pos Indonesia
- Membagi Elemen Postingan Blog Menjadi Dua Kolom Tanpa Edit HTML
- Cara Mengganti Template Baru di Blogspot
- Membuat Efek Marquee di Blogspot
- Cara Membuat Tabel dan Thumbnail di Postingan Blog
- Cara Membuat Artikel Terbaru Dengan Thumbnail di Blogspot
- Membuat Related Posts Dengan Thumbnail di Bawah Postingan
- Cara Mengganti Warna Link di Blogspot
- Cara Memberi Tombol Scroll di Kotak Komentar Blog
- Cara Membuat Related Posts Super Cepat
- Cara Pasang Tombol Spoiler di Komentar Blogspot Versi 2
- Cara Memasang Google Translate di Blog
- Cara Membuat Blockquote di Postingan Blog
- Inilah Widget Random Post Fast Loading Plus Thumbnail
- Merubah Tampilan Blog Yang Berbeda Pada Homepage dan Halaman Posting
