Script Membuat Spoiler Pada Blogspot

Assalamulaikum sahabat dan sahabati dan semua pembaca blog ini, apa kabar semuanya dan bagimana dengan puasa kalian.....??? itulah kalimat saya yang melambangkan saya dan kalian masih sangat erat persaudaraannya dan juga mengawali postingan kali ini yang perjudul Cara Membuat Spoiler Pada Blog.

Tidak sedikit teman yang bertanya bada saya bagimana Cara Membuat Spoiler Pada Blog..? sehingga saya punya inisiatif untuk memposting di blog ini sehingga nanti jika ada teman yang bertanya lagi saya tidak perlu memjawab dengan chat melainkan saya mudah mengirimkan linknya sehingga dengan mudah saya menjawab dan dia (penanya) mudah memahami.

Namun sebelum kita ke cara pembuatan ada baiknya jika kita tau apa itu Spoiler dan apa kegunaannya. Menurut saya Spoiler itu adalah teknik atau cara untuk menyembunyikan baik sebagian atau keseluruhan dari teks, gambar, atau video sekalipun dengan fasilitas tombol perintah yang biasanya menggunakan tulisan Open dan Close atau bukan dan tutup. Sehingga dengan adanya tombol tersebut kita bisa membaca dari isi spoiler tersebut jika saat tertutup. Selain kegunaan diatas Spoiler juga bisa mempersimple inface blog.

Itu Menurut Saya...!! Menurut Kamu....???

Contoh Spoiler:

Sebagai berikut :

Login ke akun Blogcpot anda

Pilih Entri Baru untuk postingan

Pilihlah pada mode HTML saat membuat postingan

atau Pilih Rancangan >>Add Gadged>> Javascript

Gunakan script berikut ini untuk membuat spoiler:

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Contoh 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 = 'View'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Letakkan teks atau script anda disini

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

Catatan :

Kata Contoh Spoiler adalah judul dari spoiler itu (yang terletak di sebelah kiri tombol Buka/ Tutup). Anda dapat menggantinya sesuai keinginan anda.

Kata Buka dan Tutup adalah kata yang terdapat pada tombol. Anda dapat menggantinya sesuai keinginan

Letakkan teks atau script anda disini adalah tempat tulisan, gambar atau video anda.

Share this post