Wednesday, February 29, 2012

Cara Membuat Spoiler Pada Blog

Cara Membuat Spoiler Pada Blog - apa itu spoiler ? spoiler adalah tombol yang dapat digunakan untuk mempersingkat postingan blog, karena spoiler akan menyembunyikan sebagian dari postingan dan bagian itu hanya dapat ditampilkan jika tombol spoiler diklik, dan dapat disembunyikan kembali jika tombol spoiler diklik lagi. Dengan begini, postingan kita tidak terlalu memakan tempat pada blog. Dalam spoiler ini, dapat digunakan untuk menyembunyikan teks, gambar, maupun video (untuk gambar dan video diubah ke bentuk script text terlebih dahulu).

Untuk lebih jelasnya tentang spoiler bisa dilihat pada contoh berikut :

Contoh Spoiler:













Anda dapat meletakkan teks, gambar, maupun video disini



Berikut ini cara membuatnya :

1. Login ke akun Blogger anda

2. Pilih New Post atau Entri Baru seperti membuat postingan biasa

3. Pilihlah pada mode HTML saat membuat postingan

4. Gunakan script berikut ini untuk membuat spoiler:


<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Contoh Spoiler</b>: <input value="View" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" 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 = 'Hidden'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'View'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
Letakkan teks atau script anda disini
<br>
</div>
</div>
</div>

Catatan :
  • Kata Contoh Spoiler adalah judul dari spoiler itu (yang terletak di sebelah kiri tombol View / Hidden). Anda dapat menggantinya sesuai keinginan anda.
  • Kata View dan Hidden adalah kata yang terdapat pada tombol. Anda dapat menggantinya sesuai keinginan
5. Klik Publish jika sudah selesai


9 comments:

  1. Replies
    1. Oke sob ... makasih dah berkunjung juga salam kenal ... :)

      Delete
  2. dgn adanya spoiler, kita bisa menghemat tempat sob...

    ReplyDelete
    Replies
    1. bener banget mas brow ... disamping itu juga buat nyembunyiin gambar teks atau vidio tapi ada kekurangannya juga yaitu gak bisa nyembunyin mbok enom ... hahaha ;)

      Delete
  3. mantab.. bisa dicoba nih, thx ya tutornya :D

    ReplyDelete
  4. silakan dicoba mumpung gratis ... ^_^

    ReplyDelete
  5. Replies
    1. silahkan sob... thanks kunjungannya... ;)

      Delete
  6. link download udah ane perbaiki gan,,thanks buat infonya n jangan lupa mampir skalian download lagi ^_^

    http://sangir01.blogspot.com/

    ReplyDelete