Membuat Tombol Klik Show Postingan Blog

Bagi sobat yang ingin memasang tombol show hide di blog / postingan, caranya gampang banget nih.
Ikuti cara berikut:

1. Buka account Blogger anda

2. Buat entri baru, dan pilih Edit HTML

3. Masukan kode berikut :
<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;”>
kepribest.com
Tutorial
</div></div></div>

Catatan:
Warna Biru bisa di ganti dengan kata atau kode yang ingin sobat masukkan.
Warna Merah di ganti dengan text yang ingin sobat posting.

Jika langkah sobat benar maka hasilnya akan seperti ini:

Klik show untuk melihat
KepriBest.com
Tutorial

Berikut ini cara Membuat Text Area blok Otomatis.

Kode-kode yang berada pada sebuah kotak dan kode tersebut secara otomatis terblok sendiri, hanya dengan menggerakkan mouse diatas kotak area berisi kode-kode tersebut, itulah yang dinamakan Teks Area Blok Otomatis. Saya yakin anda sudah pernah menjumpai yang namanya teks area blok otomatis

Coba sobat gerakkan mouse diarea teks dibawah ini :

Text Sobat Disini

Kodenya berikut ada dibawah ini:

<div>
<form name=”kepribest”>
<div align=”left” style=”margin-bottom: 0; margin-top: 0;”>
<textarea ;=”” cols=”45″ name=”txt” onmouseover=”this.form.txt.select()” readonly=”” rows=”3″ style=”height: 30; width: 150;”> Text Sobat Disini</textarea></div>
</form>
</div>

Contoh sederhana tentang cara pembuatan tombol show hide dan Text Area blok Otomatis di blog, dan cara2 yang lain bisa sobat bisa melihat di sini.

Selamat mencoba ya… Semoga bermanfaat..

Iklan

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s