cekidott !!!! Cara buat Spoiler di Blog

Kali ni sayo akan bagi² ilmu tentang caro buat spoiler di blogger ..

Karno ad seseoran adek yg request ..

hahaha

nah,,

pertamo² yg blm tau spoiler tu apo,,
Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari posting, dengan tujuan untuk menghemat space halaman posting. Biasanya yang disembunyikan dalam spoiler adalah berupa gambar.
ni na langkah² buat spoiler tu ..

ni contoh spoiler : 

contoh spoiler

check

cara membuatny :

copy aj code di bawah ni ke HTML (ingat copy ny  ke HTML kk) sewaktu buat new post/new entry/postingan baru ..

<div><div style="margin: 5px;">

<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul</span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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;">

isi spoiler

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

ket : 

-Ganti kata yang tercetak merah sesuai dgn yg di inginkan

- 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.

Contoh: kita mau bikin spoiler berisi foto Ayuk Aura kasih yang cantik tu. Misalnya diupload dengan tinypic dan kode HTML-nya seperti ini:

<a href="http://tinypic.com" target="_blank"><img src="http://i42.tinypic.com/eb1ngp.jpg" border="0" alt="Image and video hosting by TinyPic"></a>

So, kode selengkapnya di spoiler kiro² mcm ko:

<div><div style="margin: 5px;">

<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;"> Ayuk Aura Kasih</span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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;">

<a href="http://tinypic.com" target="_blank"><img src="http://i42.tinypic.com/eb1ngp.jpg" border="0" alt="Image and video hosting by TinyPic"></a>

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

Maka, kode selengkapnya di spoiler:

Ayuk Aura Kasih

Ket: Jika gambar terlalu besar, sebelum diupload kecilkan dulu size-nya dengan photoshop. Usahakan lebarnya tak lebih dari 10 cm.