• Versi Mobile
  • About
  • Contact
  • Sitemap
  • Free SMS
  • Download Lagu X Factor

Pendiari | Artikel Islam, Blog Dan Motivasi

Pendiari Blog Sederhana Berisi | Kumpulan Tutorial Blog | Artikel Islam, Muslimah, Cinta, Jodoh | Artikel Motivasi

  • Home
  • Islam
    • Artikel Islam
    • SMS Ramadhan
    • SMS Idul Fitri
  • TV Online
  • Radio Online
    • Radio Ceria
    • Radio Sunnah
    • Radio Muslim
  • Blog Tools
    • Website Speed Test
    • Ping Service
    • Phrase Kode HTML
  • Muslimah
  • Tutorial Blog
    • Java Script
    • Template
    • Widget
Home » HTML » Pasang Spoiler Diblog

Pasang Spoiler Diblog

Pasang Spoiler Diblog
Spoiler adalah suatu fitur yang dapat menampilkan suatu objek di dalamnya dengan model show,hide. Spoiler banyak dijumpai di forum-forum. spoiler berguna untuk menghemat tempat. dengan spoiler, kita dapat menyembunyikan suatu objek dan menampilkannya dengan mengklik tombol spoiler.

Cara memasang spoiler pada blog menggunakan sebuah script yang lumayan panjang. spoiler pada blog biasanya dipasang pada sidebar blog. objek di dalam spoiler biasanya adalah gambar-gambar atau video, namun kita juga bisa menyisipkan tulisan dan yang lainnya.

Berikut langkah-langkahnya :

1. Pilih Rancangan

2. Pilih HTML/Java Script

3. Copy kode dibawah ini :

    <div><div style="margin: 20px; margin-top:5px"><div style="margin-bottom: 2px;" class="smallfont"><input style="margin: 0px; padding: 5px; width: auto; " 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 = 'Hidden'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"/></div><div class="alt2"><div style="display: none;"><div style="border: none; color:none; background-color:none; text-align: justify; padding:10px;">


    KONTEN KALIAN DISINI


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



4. Klik Simpan.

Keterangan script :
1. kode yang berwarna merah (style italic/miring) harus sama. kode ini sebagai judul tombol show/open. kalian bisa mengganti judulnya.
2. kode yang berwarna merah (tanpa style italic/miring) adalah kode untuk judul tombol hide/close. kalian bisa menggantinya.
3. kode yang berwarna biru adalah isi konten atau objek di dalam spoiler, kalian bisa menngantinya sesuai kebutuhan kalian.


Selamat Mencoba Semoga Berhasil...
Written by: Pendi Ari Wibowo
Pendiari | Artikel Islam, Blog Dan Motivasi Updated at: 12/30/2010
Posted by Pendi AW on Kamis, 30 Desember 2010 - Rating: 5
Title : Pasang Spoiler Diblog
Description : Spoiler adalah suatu fitur yang dapat menampilkan suatu objek di dalamnya dengan model show,hide . Spoiler banyak dijumpai di forum-forum. s...

Bagikan Ke

Facebook Google+ Twitter

9 Responses to "Pasang Spoiler Diblog"

  1. Sun's24 April 2010 pukul 12.47

    Waw boleh dicoba kiranya???

    BalasHapus
    Balasan
      Balas
  2. Unknown24 April 2010 pukul 13.09

    Menarik banget, boleh tukar link gak sob? http://www.nimbuzz-bisnis.com/2010/04/award-you-are-nice-blogger.html

    BalasHapus
    Balasan
      Balas
  3. Annur Shah25 April 2010 pukul 08.39

    :h:
    UDHA DI COBA HEHHEHEHE

    BalasHapus
    Balasan
      Balas
  4. Pendi AW25 April 2010 pukul 13.07

    Komentar ini telah dihapus oleh pengarang.

    BalasHapus
    Balasan
      Balas
  5. Pendi AW25 April 2010 pukul 13.13

    Komentar ini telah dihapus oleh pengarang.

    BalasHapus
    Balasan
      Balas
  6. anasurba27 April 2010 pukul 14.35

    bagus sob........lanjutkan...

    BalasHapus
    Balasan
      Balas
  7. Awaluddin Jamal27 April 2010 pukul 15.37

    wah mantap nih tipsnya bang pendi..,

    ternyata bang pendi hebat juga nih soal kode-kode HTML.. :D

    BalasHapus
    Balasan
      Balas
  8. Agung Ngurah22 Juli 2010 pukul 14.05

    http://lh4.ggpht.com/_RVpTV2JOOxA/S1FVoQzxquI/AAAAAAAAByo/SFSJaRx2lbM/kaskuser_t4belajarblogger_16.gif
    Mantabbbbbb Mas

    BalasHapus
    Balasan
      Balas
  9. jordan3 Agustus 2010 pukul 04.37

    wah bang rasa nya saya tidak ingin berpisah dengan blog abang,isi nya mantab semua.saya boleh minta petunjuk yang lain nya nggak bang ?,maklum saya baru belajar ngeblog..trim's bang tutorial nya...

    BalasHapus
    Balasan
      Balas
Tambahkan komentar
Muat yang lain...

Posting Lebih Baru
Posting Lama
Beranda
Langganan: Posting Komentar (Atom)

Kata Teman

Copyright © 2014 Pendiari | Artikel Islam, Blog Dan Motivasi - All Rights Reserved
Pendi Ari Wibowo - Powered by Blogger