Cara Membuat Tombol Show & Hide pada Blog

Postingan yang terlalu panjang kadang kala terasa membosankan untuk di baca.

sehingga di butuhkan Tombol atau Button Spoiler yang berguna untuk mempersingkat tampilan sebuah blog, sehingga tampilan blog tersebut tidak terkesan terlalu panjang.

Okey sahabat DePe langsung saja di coba ya.
-login ke blogger.com > klik "Buat entri baru" > klik "HTML" di pojok kiri atas > pastekan kode di bawah ini.

<div><div style="margin-bottom: 2px;"><b><small>Klik Button / Tombol dibawah ini</small></b>

<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 style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;"> 

"Masukan Gambar,  postingan, Artikel Sobat disini"

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

Keterangan:

-Kemudian ganti kalimat yang berwarna   Merah  dan Biru  menurut keinginan Anda.
-Untuk kalimat yang berwarna   Hijau   Anda dapat menghapus kemudian menggantinya dengan Isi postingan, ataupun Gambar yang di inginkan....Selesai...

Bagaimana..? mudahkan,,, cara membuatnya... "Alhamdulillah"... Selamat mencoba.... Happy blogging...

CONTOH

Klik Button / Tombol dibawah ini