Cara Menciptakan Spoiler Di Blogger

Bagi yang pernah masuk ke forum-forum di internet menyerupai kaskus tentu tidak abnormal lagi dengan spoiler. Spoiler ini yakni sebuah tombol yang sanggup membuka dan menutup untuk menyembunyikan teks, gambar, atau video. Dengan memanfaatkan fungsi spoiler ini maka tampilan postingan akan terlihat lebih ringkas dan rapi. Mari kita coba membuat spoiler di blogger yang mudah.

Jika belum mengerti apa yang dimaksud dengan spoiler maka berikut teladan sebuah spoiler.

Logo Kursuskilat:

Bagaimana? Sudah tahu bukan? Mari kita lanjutkan bagaimana cara bikin spoiler tersebut.

Cara Membuat Spoiler

Pada ketika menulis postingan di blogger dan ingin menyisipkan spoiler. Maka masuk ke bab HTML, salin dan tempelkan script spoiler berikut ini diantara isyarat html dalam postingan Anda:

<div style="margin: 5px 21px 21px;"><div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input 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'; }" style="font-size: 11px; margin: 0px; padding: 0px; width: 50px;" type="button" value="Buka" /> </div><div class="alt2" style="border: 1px inset; margin: 0px; padding: 1px;"><div style="display: none;">Letakkan kode, teks, gambar, atau video disini </div></div></div>

Jika anda ingin menyisipkan gambar, maka masukkan isyarat html berikut pada spoiler diatas (warna hijau):

<img src="http://url.lokasigambar.jpg" />

Ganti yang teks yang berwarna merah dalam skrip spoiler diatas dengan teks dan url milik Anda sendiri. Selamat mencoba, jikalau sudah berhasil atau gagal silahkan tinggalkan komentar. Terimakasih.

Sumber: