Cara membuat Spoiler - Blog Kang Fatur
Spoiler adalah suatu script yang menyembunyikan link, gambar, kalimat, dan lain-lain. Spoiler ini bermanfaat sekali karena bisa menghemat tempat dan bisa seperti kejutan buat para pembaca.

Spoiler ini bisa sobat pasang di mana saja terserah sobat maunya, misalkan di bagian postingan untuk menyembunyikan postingan yang panjang, atau di sidebar-sidebar untuk menyembunyikan untuk menyembunyikan widget-widget sobat atau mungkin juga untuk yang kejutan kejutan gitu hehehe.

OK bagi para sahabat blogger yang masih pemula atau awam alias newbe seperti saya, mungkin belum paham alias tidak tahu apa, gimana, dan seperti apa itu yang namanya spoiler silahkan klik tombol buka di bawah ini, apa gerangan yang terjadi hehehe.


Spoiler:




MMMMMMMMMmmmmmmmmm.........








OK mungkin dengan mengklik tombol Open di atas sobat bisa tau atau langsung paham apa itu spoiler. kalau sudah paham dan tahu kemudian ingin mencobanya atau membuat mari kita lanjut ke tahap berikutnya.

Kalau untuk menyembunyikan Widget langkahnya sebagai berikut :

1. Seperti biasa Log In ke Blog sobat
2. Setelah login ke dasbor
3. Pergi ke Tataletak (Rancangan)
4. Tambah Gadget (HTML/Javascript)
5. Setelah itu masukan kode di bawah ini:

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">


Naaah di sini isi yang mao sobat sembunyiin


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


Kalau untuk menyembunyikan Postingan tinggal paste aja di area kerja postingan OK.

PERHATIAN
Kode atau tulisan Buka yang berwarna merah silahkan sobat ganti dengan kata sesuai keinginan, misalnya Show, Open atau apa aja deeh. terus tulisan Tutup yang berwarna kuning silahkan ganti dengan kata Close atau apa ja terserah gimana sobat. Terus satu lagi kalimat atau kata Naaah di sini isi yang mao sobat sembunyiin ganti dengan isi yang mao sobat sembunyikan OK. selesai deeh gampang khan??


Selamat mencoba, semoga bermanfaat.

Cara membuat Spoiler

Spoiler adalah suatu script yang menyembunyikan link, gambar, kalimat, dan lain-lain. Spoiler ini bermanfaat sekali karena bisa menghemat tempat dan bisa seperti kejutan buat para pembaca.

Spoiler ini bisa sobat pasang di mana saja terserah sobat maunya, misalkan di bagian postingan untuk menyembunyikan postingan yang panjang, atau di sidebar-sidebar untuk menyembunyikan untuk menyembunyikan widget-widget sobat atau mungkin juga untuk yang kejutan kejutan gitu hehehe.

OK bagi para sahabat blogger yang masih pemula atau awam alias newbe seperti saya, mungkin belum paham alias tidak tahu apa, gimana, dan seperti apa itu yang namanya spoiler silahkan klik tombol buka di bawah ini, apa gerangan yang terjadi hehehe.


Spoiler:




MMMMMMMMMmmmmmmmmm.........








OK mungkin dengan mengklik tombol Open di atas sobat bisa tau atau langsung paham apa itu spoiler. kalau sudah paham dan tahu kemudian ingin mencobanya atau membuat mari kita lanjut ke tahap berikutnya.

Kalau untuk menyembunyikan Widget langkahnya sebagai berikut :

1. Seperti biasa Log In ke Blog sobat
2. Setelah login ke dasbor
3. Pergi ke Tataletak (Rancangan)
4. Tambah Gadget (HTML/Javascript)
5. Setelah itu masukan kode di bawah ini:

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">


Naaah di sini isi yang mao sobat sembunyiin


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


Kalau untuk menyembunyikan Postingan tinggal paste aja di area kerja postingan OK.

PERHATIAN
Kode atau tulisan Buka yang berwarna merah silahkan sobat ganti dengan kata sesuai keinginan, misalnya Show, Open atau apa aja deeh. terus tulisan Tutup yang berwarna kuning silahkan ganti dengan kata Close atau apa ja terserah gimana sobat. Terus satu lagi kalimat atau kata Naaah di sini isi yang mao sobat sembunyiin ganti dengan isi yang mao sobat sembunyikan OK. selesai deeh gampang khan??


Selamat mencoba, semoga bermanfaat.

5 comments:

  1. sip mas tutorialnya...siap diimplementasikan

    ReplyDelete
  2. weh kang,, fotonya kok di kasih yang cantik2 gitu toh... ya mbok di kasih yg lebih serem lagi npa... :))

    ReplyDelete
  3. kang yg spoiler nambah gbr na gmana kang ???? pliss tunjukin....

    EMAIL: prima.wahyudi.95@gmail.com

    ReplyDelete

Subscribe Our Newsletter

Notifications

Disqus Logo