Home » » Cara mambuat Spoiler Multi pungsi

Cara mambuat Spoiler Multi pungsi

Sebagian orang pastinya sudah tahu apa itu spoiler, apalagi kalau sering bermain di forum. Spoiler sudah pasti sering digunakan. Lalu bagaimana kalau mau menerapkan atau membuat spoiler di blog? Sebelumnya kalau ada yang belum tahu apa itu spoiler. saya jelasin singkat saja. Spoiler adalah tombol yang diguanakan untuk menyingkat tempat atau menyembunyikan konten (teks, foto atau video) dengan buka tutup. Contohnya bisa dilihat di bawah halaman ini.

Spoiler bisa juga dibuat di blog, lebih khusus dipostingan. Biasanya digunakan untuk membuat penasaran si pembaca dengan menyembunyikan terlebih dahulu. Untuk melihatnya dengan mengklik tombol spoiler itu. Selain itu juga untuk menghemat tempat, ya karena buka tutup itu (spoiler). Lalu bagaimana cara membuat spoiler di blog? Langsung simak yang berikut ini.

Cara Membuat Spoiler di Blog
1. Login ke Blogger
2. Pilih New Post atau Entri Baru seperti membuat postingan biasa
3. Pilihlah pada mode Edit HTML saat membuat postingan
4. Gunakan kode script berikut ini untuk membuat spoiler:

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Letakkan teks atau kode script (gambar atau video) di sini
 <br>
</div>
</div>
</div>




5. Untuk yg berwarna merah,Kita dapat mengganti Judul Spoiler sesuai kehendak kita, begitu juga dengan teks Buka dan Tutup nya.
6. untuk isi dari spoiler anda dapat menggantinya dengan warna yg berwarna hijau
7. Klik Publish atau Terbitkan Entri jika sudah selesai.

Semoga cara membuat spoiler ini bisa bermanpaat untuk sobat-sobat smua....!!


Judul Spoiler:
SELESAI DECH CARA MEMBUATNYA,SILAHKAN MENCOBA
Share this article :

0 komentar:

Posting Komentar

Kepada Kawan - Kawan Semua, Berkomentarlah dengan baik dan sopan.
Jika ada Embel - Embel Link mohon maaf, komentar akan saya hapus.


 
Support : Your Link | Your Link | Your Link
Copyright © 2013. Net- Blog ™ - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger