Membuat Spoiler

Cara membuat spoiler sebagai berikut:

   1. Login Blogger.
   2. Copy kode HTML berikut ini, letakkan sesuai kebutuhan:

    <div id="spoiler">

    <div>

    <input name="button" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'LIHAT LAGI'; }" style="font-size: 11px; font-weight: bold; margin: 5px; padding: 0px;" type="button" value="SPOILER DEMO" /></div>

    <div id="show" style="border: 1px solid white; display: none; margin: 5px; padding: 2px; width: 98%;">

    <div style="background: none repeat scroll 0% 0% #e8f7e7; border: 1px solid #aaccee; color: black; margin: 0px; padding: 7px;">



    <div class="separator" style="clear: both; text-align: left;">

    <img border="0" height="107" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhd5JeG3yKufarSsd5F_90jI-cGvFXWEaV5xBDm7Ddicv-i1fu5GutrIb3W1vbp882YI6Y_X9ps4EDEx9llRV-OV-HYFfdC4GpwYNTA7opvqcm_j6smG71U2kwDuofa7TzgtU4Zv-onEe0/s1600/sproiler.jpg" width="125" /></div>


    <div style="text-align: center;">

    text area / kode HTML</div>



    </div>

    <div id="hide">

    </div>

    </div>

    </div>

      Save!.

text area / kode HTML

NB:

    * Untuk tulisan yang di beri tanda Biru silahkan rubah sesuai keinginan.
    * URL image yang berwarna Hijau ganti dengan URL image anda.
    * Text yang berwarana Merah isi dengan tulisan / kode HTML sesuai keinginan.
    * Untuk Baground bisa bisa di ganti dengan kode warna lain.
    * Untuk yang lain nya silahkan cari sendiri, seperti ukuran, font dll.

Selamat mencoba...