Cara Membuat Spoiler di Blogspot

Bagi Sobat yang gemar berbagi di suatu forum mungkin sudah tak asing lagi dengan yang namanya spoiler. Yaitu teknik menyembunyikan gambar/teks/video dll untuk menghemat space. Spoiler ternyata bisa juga diterapkan di blog. Cara membuat spoiler di postingan blog (baik berbasis blogger/blogspot maupun wordpress) sangat mudah.
Tapi sebelum menginjak ke tutorialnya, yang saya ketahui setidaknya ada dua model spoiler, namun saya tidak akan membingungkan sobat untuk tipsnya, jadi saya hanya memberi satu model spoiler saja biar mudah mengingatnya.

Contoh spoiler seperti dibawah ini dengan gambar artis cantik yang lagi dirundung masalah akhir-akhir ini :

Cara membuatnya gampang kok, langsung saja copas scriptnya seperti dibawah ini :


<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;"><span style="color: rgb(255, 0, 0);">JUDUL</span></span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; " 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
<span style="color: rgb(255, 0, 0);">
ISI SPOILER
</span>
</div></div></div></div>

Keterangan :

- Ganti kata yang tercetak merah sesuai yang diinginkan.

- Jika spoiler berisi gambar, anda upload dulu dengan blogspot atau pengupload macam photobucket, tinypic, dll, lalu ganti 'isi spoiler' dengan kode HTML gambar yang sudah diupload.

- Jika spoiler berisi video, ganti 'isi spoiler' dengan embed kode video.

- Jika gambar terlalu besar, sebelum diupload kecilkan dulu size-nya dengan photoshop. Usahakan lebarnya tak lebih dari 10 cm atau sudah ada penyesuaian gambar pada situs uploader tinypic.com atau pun photobucket.com, jadi Anda perlu menyesuaikan besar kecilnya gambar sesuai dengan selera Anda.

Mudah khan? dicoba aja Sob ...

sumber : wawanwae.blogspot.com

.

.

.

ARTIKEL TERKAIT ADA DIBAWAH SPONSOR (DIBAWAH INI).

Artikel Terkait