Membuat Spoiler Pada Posting

Mungkin dari sobat blogger semuanya, pastinya sudah tahu apa itu spoiler, apalagi yang sering main di forum tuh. Spoiler sudah pasti menjadi hal sering dipakai. Lalu kalau kita ingin menerapkannya di blog kita? emmmhh.. pastinya keren donk.

Sebelumnya kalau ada yang masih belum tahu, apa itu spoiler? Saya akan jelasin singkat saja.
==>> Spoiler adalah tombol yang diguanakan untuk menyingkat tempat atau menyembunyikan konten (teks, foto atau video) dengan klik untuk membuka dan menutup.

Contohnya bisa dilihat di bawah halaman ini :

Judul Spoiler:

Letakkan teks atau kode script (gambar atau video) di sini sob..!!



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).

Cara Membuat Spoiler Pada Postingan 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 sob..!!

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

5. Kita dapat mengganti Judul Spoiler sesuai keinginan kita, begitu juga Buka dan Tutup.
6. Klik Publish atau Terbitkan Entri jika sudah selesai.
Share this article :
 

Posting Komentar

 
RIEZTOSHAREFree Automatic Link Free Automatic Link Free Automatic Link Free Automatic Link Teman Link Unlimited Backlink Exchange Free Automatic Link kostenlose backlinks http://lieblinks.blogspot.com/ Unlimited Backlink Intercambio gratis de Enlaces Unlimited Backlink Exchange Unlimited Backlink Auto Backlink Gratis : Entekom Link Auto Backlink Gratis Indonesia : Top Link Indo Indonesian Free Auto Backlink ExchangeTukeran Link | Backlink | Link Exchange Free Automatic Link Unlimited Backlink Unlimited Backlink Intercambio gratis de Enlaces Free Backlink backlink Mariachi Backlink Exchange Free Backlinks Free Automatic Link Blogs and More - Plugboard Mariachi Backlink Exchange Die Gute Saat Unlimited Backlink Kostenlose Backlink Austausch Unlimited Backlink Free Automatic Link Free Automatic Link Free Automatic Link Tukar Backlink Exchange Free Automatic Link Free Backlinks Exchange Free Automatic Link Free Backlinks Text Back Link Exchange Text Back Links Exchange Text Back Links Exchanges linkomania.site50.net Linkon Bedava - Free Backlink Ping your blog, website, or RSS feed for Free Free backlinks for your site powered by http://blogbiztutor.blogspot.com/
Copyright © 2012. Tutorial EDU Themes - All Rights Reserved