Cara Membuat Spoiler Berisi Gambar di Blog

Caranya :
  1. Login ke Blogger
  2. Pilih New Post atau Entri Baru
  3. Kemudian pilih mode HTML (selain Compose) saat membuat entri baru
  4. Sisipkan kode script di bawah ini untuk membuat spoiler :
  5. <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'; }" style="font-size: 11px; margin: 5px 0px 20px; padding: 1px; width: 55px;" type="button" value="LIHAT" /></div> <div id="show" style="border: 1px solid white; display: none; margin: 0px 0px 0px 0px; padding: 0px; width: 100%;"> <img alt="spoiler pada blogspot" class="aligncenter" height="250" src=" LINK GAMBAR " width="250" /> </div> <div id="hide"> </div> </div>
  6. Ganti tulisan LINK GAMBAR dengan link gambar anda sendiri, misal :
    https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbvsKMWSK6RP57WHY_y8b_REgwkvnIQQk1BrHNOCyYvCV_0B1gzOxogJFfdF5_AdsdiDb3jTI7hJmgyV6oe_ErFqZPKV9FepB1PlTid4TBAzYMbehkyxiQg72Mx0hlb8pr3i8llqZkeRjq/s1600/zombie.gif
  7. Kemudian klik Publish atau Publikasikan dan lihat hasilnya
  8. Contoh :
Semoga bermanfaat, selamat mencoba...


3 komentar:

  1. makasih mas.
    membantu sekali info nya.
    ;)

    BalasHapus
  2. Makasih bro ilmunya, Thanks for sharing

    BalasHapus
  3. @Satriyo Adhie (Satriyo Adhie) : iya mas Satriyo.. senang bisa membantu..semoga bermanfaat..
    @Aditya Diar p : iya bro terima kasih kembali...semoga bermanfaat..

    Terima kasih sudah mampir ke blog ini...
    Monggo lihat-lihat posting menarik lainnya...

    BalasHapus