Cara Menyembunyikan/Menampilkan Text dan Gambar

Saya rasa sobat sudah pada kenal yang namanya form button ya,bagaimana membuat form button dengan posisi berjejer alias horizontal.Namun kali ini, Pelajaran Blog bukan sharing bagaimana membuat link form button melainkan membuat form button untuk menyembunyikan dan menampilkan sebuah teks atau image(gambar),atau yang sudah agan tahu dengan istilah spoiler.

Contoh :


Berikut tutorialnya ...
1. Loggin ke blogger=>pilih Tata Letak / Rancangan
2. klik tulisan Add New Widget atau Tambah Gadget
3. Selanjutnya pilih HTML/Javascript
4. Kalau sudah ketemu, copy dan pastekan script/ code berikut

<div><input type="button" value="Lihat Gambar" style="margin:0px;padding:0px;" 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 = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Lihat Gambar'; }"></div>
<div style="background: #ffffff; margin: 10px auto; border: 0px solid #000;padding: 5px;"><div style="display: none;">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg73JMsy38DQgw_FEWelNd6wBohE-kvtCMZ3tefzu60njeXgxd0yMTYId9fGcHB_JojcJo0hI6uNf9UOwkNKWjwkeOL06STyarrdKXMqEYb4p_unq-hATJ-pUQuyIi00pfUKa42dpElyCgj/s1600/nenek+okem.jpg" alt="Cara Mudah dan Cepat Membuat Spoiler di Blogger" title="Cara Membuat Spoiler di Blogger." width="300" height="200"/>
</div>



5. Simpan template

Catatan :
Kode yang berwarna merah Silahkan diganti   berupa text atau alamat  gambar , terserah agan.
Selesaaaii ,.. ! Smoga " Manfaat Untuk Kalian Semua .... ^_^


EmoticonEmoticon