Cara Mudah Membuat Spoiler Pada postingan

Spoiler berguna untuk menyembunyikan kalimat yang terlalu panjang pada postingan. Jika blog sobat membahas tentang seputar tutorial blog, spoiler ini bermanfaat untuk menyembunyikan postingan tertentu (kode HTML) yang terlalu panjang, seperti yang cs gunakan di postingan ini. Jika sobat tertarik untuk memasangnya, simak cara mudah membuat spoiler pada postingan.

1. Pertama login ke Blogger

2. Buat sebuah Postingan baru

3. Pilih HTML

4. Masukkan kode dibawah ini

Lihat Kode :

<div>

<div style="margin: 4px;">

<div class="smallfont" style="margin-bottom: 2px;">

<i><span style="font-weight: bold;">Klik Show Untuk Membukanya</span></i><inputonclick="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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" type="button" value="Show" /></div>

<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">

<div style="display: none;">

Isi spoiler,bisa berupa gambar,teks atau video

</div>

</div>

</div>

</div>

  Atau Masukkan kode yang di bawah ini

Lihat Kode :

<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;">
<b>Lihat Kode</b> : <input 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'; }" style="font-size: 12px; margin: 0px; padding: 0px; width: 55px;" type="button" value="Buka" />
</div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
Masukkan gambar , kata atau script lainnya disini</div>
</div>
</div> 

Tulisan yang berwarna hijau bisa sobat ganti dengan kalimat yang diinginkan
Tulisan yang berwarna biru untuk memasukkan tulisan/gambar yang sobat inginkan

5. Klik Publikasikan dan lihat hasilnya

Gampang kan cara membuatnya! Demikian cara membuat spoiler pada postingan, semoga dapat membantu dan bermanfaat. Terima kasih atas kunjungannya.

loading...

► Copas Sange ◄

Sobat sedang membaca artikel tentang Cara Mudah Membuat Spoiler Pada postingan. Jika sobat ada pertanyaan atau pesan mengenai artikel diatas, salurkan pada kolom berkomentar !! Dan untuk mendapatkan tambahan pahala, silahkan LIKE and SHARE ♂ <a href="https://copasange.blogspot.com/2016/04/cara-mudah-membuat-spoiler-pada.html" target="_blank">Cara Mudah Membuat Spoiler Pada postingan</a>

:: Salam Blogger ! ::

LANGGANAN ARTIKEL GRATIS

Dapatkan Artikel Terbaru Disini !

Masukkan email anda di bawah ini ! Maka otomatis anda akan mendapatkan kiriman terbaru dari Blog ini secara gratis via email. Terimakasih.