Cara Membuat Menu Menarik Dengan Spoiler

Spoiler adalah sebuah kolom yang bisa dibuka dan ditutup serta ada border atau garis yang membentuk kolom. Fungsinya adalah sama seperti fungsi scroll yang bertujuan untuk menghemat ruang halaman saat memposting gambar atau tulisan yang banyak sehingga terlihat tertata dan rapi. (contoh:' lencana facebook' yang ada disisi kanan)

Oke untuk cara silahkan ikuti

1. Login Ke blog anda

2. Klik Rancangan / Layouut
3. Klik Tambah gadget
4. Klik html / javascript
5. Copy paste kode di bawah ini

---

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b>: <input value="Open" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Close&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Open&#39;; }" type="button" />

</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

---

Isikan kode, script, HTML atau Teks anda disini..

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

keterangan:

1. Tulisan Spoiler adalah judul,bisa ganti sesuai keinginan Anda

2. Tulisan yang berwarna biru Anda ganti sesuai dengan tulisan/scrip yang ingin Anda masukkan pada kolom bagian dalam spoiler.

Bagikan Artikel ini