Cara Menciptakan Hidangan Spoiler Pada Postingan Blogger

Cara Membuat Menu Spoiler Pada Postingan Blogger Ketika menampilkan gambar besar atau arahan script yang panjang di artikel / postingan blog tentu akan sangat mengganggu pandangan mata pengunjung sehingga blog terkesan tidak rapi. Selain itu gambar / foto yang besar akan menambah berat loading blog yang sudah niscaya akan memperburuk SEO.

Hal menyerupai itu sanggup diakali dengan memasang spoiler di blog, yang seperti menyembunyikan script atau gambar sampai ada yang menekan tombol spoiler tersebut untuk menampilkannya.

contoh spoiler

CARA MEMBUAT MENU SPOILER

Sebenarnya tehnik menyerupai ini sudah usang dipakai oleh para blogger, Dan saya kira tidak ada salahnya jikalau menulis ulang semoga sanggup dipakai kembali bagi yang memerlukannya.

Berikut ini langkah-langkah menciptakan spoiler di blog :

• Masuk ke sajian postingan (seperti biasa dikala mau buat artikel)

• Tentukan posisi yang ingin diletakkan sajian spoiler

• Klik Tab HTML ( sebelah compose )

baca juga artikel : cara menciptakan goresan pena berjalan

• Copy dan Letakkan script di bawah ini pada bidang yang diinginkan

<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;">
<i><span style="font-weight: bold;">JUDUL</span></i><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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="margin: 0px; padding: 0px; width: 65px;" type="button" value="Show" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
ISI SCRIPT / GAMBAR DI SINI
</div></div>
</div></div>

• Ganti "JUDUL" sesuai dengan harapan ( teks warna merah)

• Letakkan arahan script atau gambar yang ingin disembunyikan di bab " ISI SCRIPT / GAMBAR DI SINI" ( teks warna biru)

• Simpan / Save , Lakukan pratinjau terlebih dahulu untuk memastikan sesuai dengan posisi keinginan

Nah, Sekarang sudah tahu kan cara menciptakan sajian spoiler ? Praktis sekali bukan ? Silahkan dicoba ... Salam sukses