Alexa Metrics Cara Membuat Spoiler Versi Keren - Coretan Uman

Cara Membuat Spoiler Versi Keren

Cara Membuar Spoiler Versi Keren
Oke sob, kemaren udah janji kan mau bikin postingan tentang Cara Membuat Spoiler versi keren-nya di artikel sebelumnya: Cara Membuat Spoiler Sederhana :) Nah sekarang kita langsung ke TKP aja. Ini dia langkah-langkah mudah-nya:

Langkah-langkah Membuat Spoiler Keren

  • Pertama login ke blogger
  • Masuk ke Edit HTML
  • Cari kode ]]></b:skin>
  • Copy Paste kode berikut tepat diatas kode ]]></b:skin>
.spoiler{background:#f9f9f9 url(https://lh3.googleusercontent.com/-CoP7gpji2kI/UAlWXkvzDfI/AAAAAAAABA0/i49o5VKz3F0/h120/gradient2.php.png) repeat-x;border:1px solid #ddd;padding:3px}.spoirel{font-family:arial;font-size:12px;color:#555;margin-bottom:0;font-weight:bold;text-align:left}
  • Klik Simpan Template
  • Kemudian Jika ingin membuat spoiler di widget, maka buka Tata Letak/Layout Blogger,
  • Klik Tambah Gadget, klik Tambah HTML/Javascript
  • Kemudian Copy Paste kode berikut:
<div class="spoiler"> <div class="spoirel">Judul Widget Anda<input 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 = 'TUTUP'; this.value = 'tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = 'buka'; this.value = 'buka'; }" style="background: #f9f9f9; border: 0px solid #000; color: #8B4513; font-family: arial; font-size: 10px; margin: 0px;font-weight:bold;text-transform:uppercase;float:right;" type="button" value="LIHAT" /></div> <div style="border: 0px inset #fff; color: blue; margin: 0 10px 0px 10px; text-align:center;padding: 0px;"> <div style="display: none;"> <br />Masukan Kode Widget Anda</div> </div> </div>

  • Ganti Teks  yang berwarna diatas sesuai yang anda inginkan.
  • Jika ingin membuat spoiler lagi, tinggal copy paste kode diatas, tidak perlu edit html lagi :)
Selamat Mencoba, dan Semoga bermanfaat :)

11 Komentar pada "Cara Membuat Spoiler Versi Keren"

  1. ane bingung, gimana cara gunainnya tuh gan ?

    BalasHapus
    Balasan
    1. :p Tinggal ikuti aja langkah2 diatas gan. Terus lihat hasilnya dengan mengklik tombol LIHAT(Untuk membuka) TUTUP(untuk Menutup) :q

      Hapus
  2. thanks gan, mantap langsung diterapkan di www.subamper.org

    BalasHapus
  3. This is the perfect webpage for anybody who wishes to find out about this topic.
    You understand a whole lot its almost hard to argue with you (not that I personally will
    need to?HaHa). You definitely put a new spin on a subject that's been written about for decades.
    Great stuff, just great!

    BalasHapus
  4. I am glad that I discovered this blog, exactly the right info that
    I was searching for!

    BalasHapus

Apa pendapatmu? Tuliskan komentarmu dengan baik! (Mohon Maaf Link Tidak Diterima)

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel

Merasa Artikel Ini Bermanfaat? Silahkan Share atau Bagikan Artikel ini dengan Klik Tombol-tombol Di Bawah Agar Bisa Bermanfaat Juga Untuk Orang Lain :) Terimakasih!