Membuat Tombol Klik Show Membuat Tombol Klik Show

Kemarin ada salah satu teman blogger yang bertanya kepada saya lewat komentar spam pada salah satu blog saya yang tidak tampil diposting tentang Cara membuat Tombol Klik Show Untuk Melihat di Postingan Blog.

Bagi teman-teman yang ingin memasang tombol show hide di blog / postingan, caranya gampang banget nih. Teman-teman hanya perlu mengcopy paste kode HTML di bawah ini:

Klik show untuk melihat

<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</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;"> Masukkan tulisanmu di sini </div></div></div>

Entri melalui HTML Jangan melalui Compose seperti tanda panah pada gambar di bawah:

<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</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;">

Masukkan tulisanmu di sini

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

Lalu paste code di atas dan jangan lupa mengganti kata yang digaris tengah yang berwarna biru  dengan kata atau kode yang ingin teman-teman masukkan. Teman-teman juga bisa mengganti kata yang berwarna orange dengan kata yang diinginkan.

Masukkan kode di atas ke dalam postingan atau di sidebar blog teman-teman, .