Home » » Cara Membuat Spoiler Di Blog

Cara Membuat Spoiler Di Blog

Posted by Ampas Kopi on Monday, July 15, 2013


Prima Share - Sebagian dari kamu udah enggak asing lagi sama " spoiler " kan ?? Yang belum tau apa itu " spoiler " nih gue kasih tau : Spoiler adalah tombol yang diguanakan untuk menyingkat tempat atau menyembunyikan konten (teks, foto atau video) dengan buka-tutup.Contohnya bisa dilihat di widget " Site Info " di blog ini

spoiler pada blog

Fitur spoiler biasanya banyak digunakan di website forum seperti KASKUS dan kini sudah bisa digunakan di Blogspot secara instan tanpa mengedit template Blog.Kelebihan dari penggunaan widget spoiler adalah :


1). Load dari web atau Blog akan menjadi lebih ringan jika semua gambar diletakkan di dalam spoiler, karena pada saat load pertama gambar tidak akan ditampilkan sampai pengunjung sendiri yang akan melihatnya dengan mengklik tombol spoiler.( lumayan buat yang Internetnya lemot hehehe... )

2). Akan lebih menghemat tempat ( space) di dalam halaman artikel kita.

Lalu, bagaimana cara memasangnya di blog ??? ikuti tutorial berikut ...

1. Log-in ke Blogger
2. Buat Entri Baru ( New Post )
3. Pilih mode " HTML
4. Masukan kode berikut utuk membuat spoiler .. 

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Judul</b>: <input value="Open" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" 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 = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
Letakan tulisan, kode, gambar, atau video-mu disini !
 <br>
</div>
</div>
</div>

5. Kamu bisa mengganti tulisan yang berwarna merah dengan kata-katamu sendiri 
6. Klik Publish jika sudah selesai menulis artikelnya 

Selain di artikel, kamu juga bisa memasangnya di widget seperti di blog ini.
Sekian artikel tentang Cara Membuat Spoiler Di Blog  semoga bermanfaat ...

Jangan dibuka ..!! 18+:
Prima Share

follow @primamulia62





6 komentar:

Anonymous said...

Keren sob, hehehe..kapan2 mau coba...

★ http://www.mas-arul.com/

Anonymous said...

Bookmars dulu ah

Aji Apps said...

Ini nie yg aku cari trnyata dpet... hehe
makasih bnget ya Gan,,,

http://aji-apps.blogspot.com/

Primamulia Teguh said...

sip deh! :)

Primamulia Teguh said...

sip deh! :)

Primamulia Teguh said...

sip deh! :)

Post a Comment

-Berkomentarlah dengan sopan dan di larang menyisipkan link aktif