Cara membuat spoiler postingan diblog

Mau tau apa itu Spoiler? spoiler ialah salah satu tips untuk mengurangi beban loading pada blog adapun Spoiler ini mempunyai tujuan yang sama seperti fungsi read more yaitu menghemat ruang dalam suatu postingan. Sedikit perbedaan dengan fasilitas nya Spoiler sering dipakai untuk menyembunyikan suatu link, gambar kumpulan teks, atau seluruh bagian dari isi postingan. Spoiler juga dapat mengurangi waktu loading yang memberatkan blog anda ketika dibuka. Nah langsung saja Untuk mengaktifkan Spoiler pada blog anda bisa ikuti langkah-langkah dibawah ini
Dengan menambahkan kode dibawah ini:pada editor tampilan html post
Berikut kode untuk menyembunyikan teks postingan

<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><input style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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'; }" type="button" value="Show" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px; background: #FAFAF7;">
<div style="display: none;">cara ini adalah tampilan spoiler untuk menyembunyikan teks</div>
</div>
</div>

cara ini adalah tampilan spoiler untuk menyembunyikan teks

Berikut kode untuk menyembunyikan gambar

<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><input style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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'; }" type="button" value="Show" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px; background: #FAFAF7;">
<div style="display: none;"><img class="aligncenter" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8vbvwGxTieknyh1h4LlzopGWafRbLIBJ8mOuqmMxpS11_sEYh9Egi_UraU68-2T75uzLF6Rym8jN5slMjnW_OyLdUJuDJfXLbPWQnQNaJgAcH9yXETwi-wcEbS4-F21_yDbBiT7U1_Q-7/s1600/Gif.gif" alt="monyet" width="300" height="280" /></div>
</div>
</div>

Silahkan ganti url
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8vbvwGxTieknyh1h4LlzopGWafRbLIBJ8mOuqmMxpS11_sEYh9Egi_UraU68-2T75uzLF6Rym8jN5slMjnW_OyLdUJuDJfXLbPWQnQNaJgAcH9yXETwi-wcEbS4-F21_yDbBiT7U1_Q-7/s1600/Gif.gif
Untuk menyembunyikan gambar yang di inginkan

Related Post