Home » » Cara Membuat Tombol Spoiler (Open-Close) Di Blog

Cara Membuat Tombol Spoiler (Open-Close) Di Blog

Ditulis oleh Dicky Fajriansyah pada Sabtu, 13 April 2013 | 00.36


Dicky's kali ini dapat ide ngeposting nih, dan kali ini juga Dicky's akan menshare Tips Blog yang berjudul Cara Membuat Tombol Spoiler (Open-Close) Di Blog | Tombol Spoiler berfungsi untuk membuka dan menyembunyikan gambar atau text, sebenarnya blog-blog tetangga sudah banyak yang ngeposing ini, tapi Dicky's tidak menyerah, berjuang.... jika sobat ada yang belum tau apa itu tombol spoiler, sobat bisa lihat DEMO di "Statistik Dicky's Blog". Oke, jika sobat ingin memasangnya di blog sobat, ikuti step by step dibawah ini.

Berikut Cara Membuat Tombol Spoiler (Open-Close) Di Blog :
  • Login ke Blogger, atau klik disini
  • Copy kode dibawah ini, jika sobat mau menaruh di posting, disitu ada 2 mode, Compose dan HTML, sobat pilih HTML dan pastekan ke kolom HTML, dan jika sobat mau menaruh di HTML/Javascript pastekan kode dibawah ini ke kolom HTML/JavaScript


<div id="spoiler">
<div><input type="button" value="Buka" style="margin:0px;padding:0px;" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka Lagi'; }">
</div>
<div style="background: transparent; margin: 10px auto;
border: 0px solid #000;
padding: 5px;">
<div style="display: none;">
Tulisan terserah sobat........
</div>



Note :
- Text yang berwarna Biru ganti dengan text terserah sobat.
- Text yang berwarna Merah ganti dengan kode warna terserah sobat, atau sobat bisa masuk ke sini
- Text yang berwarna Ungu bisa sobat ganti dengan tulisan, gambar, video.
  • Publikasikan/Simpan


Sekian Tips Blog yang berjudul Cara Membuat Tombol Spoiler (Open-Close) Di Blog.....

Semoga bermanfaat.....

dan Selamat Mencoba......
Dilarang menduplikasi dan menyerbarluaskan artikel tanpa menyertakan sumbernya. Jika melanggar, berarti telah melanggar UUD 1945 No. 19 Tahun 2002 Tentang Hak Cipta dan akan dijatuhi denda.
thumbnail Title: Cara Membuat Tombol Spoiler (Open-Close) Di Blog
Posted by:Dicky Fajriansyah
Published :2013-04-13T00:36:00-07:00
Rating: 5
Reviewer: 100 Reviews
Cara Membuat Tombol Spoiler (Open-Close) Di Blog

0 komentar:

Posting Komentar