Monday 30 September 2013

Cara Membuat Tombol Show - Hide Di Blog


Saatnya posting... kali ini saya akan membahas tentang cara membuat tombol hide-show atau juga lebih dikenal dengan istilah spoiler. manfaat dari tombol hide-show atau spoiler ini adalah untuk menyingkat suatu tampilan fitur atau objek lain. misalnya kalian punya artikel atau widget yang panjang pasti akan banyak memakan tempat bukan?? dan di lihat juga kurang sedap.. hehe..

untuk lebih jelasnya kalian bisa lihat contohnya di bawah ini :
Silahkan diisi apa saja di sini, yang memang dirasa perlu tuk disingkat
     
     
    OK langsung saja ini caranya :
  1. Login to Blog Anda.
  2. Setelah masuk di halaman Dasboard, KLIK link Tata Letak.
  3. KLIK Add Gadget/Tambah Gadget.
  4. KLIK HTML/Javascript.
  5. Pastekan Kode Ini :
<div><div style="margin: 5px;">
<div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="Show" 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 = 'Tampilkan'; }" type="button"/>
</div>
<div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2">
<div style="display: none;">
Silahkan diisi apa saja di sini, yang memang dirasa perlu tuk disingkat
</div></div></div></div> 


6. KLIK SAVE/Simpan, kemudian lihat hasilnya dengan membuka blog.


Keterangan
:
-.Biru: Silahkan anda ganti dengan kata-kata yang anda inginkan misal: Munculkan, atau show!
-.Orange: Anda bisa menggantinya dengan kata yang anda inginkan, misal: Hide, atau hilangkan!
-.Hijau: Silahkan disisipi dengan teks atau kode yang memang perlu disingkat.

Good Luck


EmoticonEmoticon