Membuat spoiler pada postingan

Mumpung lagi liburan banyakin postingan boleh dong. Kali ini ane mau ngebahas tentang spoiler. Sedikit penjelasan mengenai spoiler adalah sebagai berikut :

spoiler adalah tulisan atau keterangan mengenai suatu cerita, yang membeberkan jalan cerita tersebut. Membaca beberan dari suatu cerita dapat menyebabkan berkurangnya kesenangan membaca cerita itu, karena kesenangan membaca sebuah cerita biasanya tergantung kepada dramatisasi atau ketegangan yang ditimbulkan oleh cerita tersebut. Biasanya dalam media massa maupun internet, beberan disembunyikan dengan cara tertentu, sehingga hanya terbaca oleh yang ingin melihat beberan tersebut.

Ngerti maksudnya ? Ane juga gak tuh, terlalu teoritis. Secara sederhana spoiler itu alat dalam website yang digunakan untuk menyembunyikan. Entah itu tulisan, gambar, atau apa aja deh. Kalau ngumpetin duit bisa gak ya??? (mulai ngaco...). Keuntungan menggunakan spoiler kita dapat mempercepat loading. Loading gambar dengan spoiler akan jauh lebih cepat bila dibandingkan dengan gambar biasa jadi lebih nyaman deh blog kamu.

Contoh konkret :

Apakah yang dimaksud dengan spoiler itu sendiri? Kenapa harus menggunakan spoiler dalam pem-blogging-an? Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, seluruh atau sebagian isi dari postingan blog kita, dan lain-lain. Spoiler ini juga bisa menguntungkan kita dalam hal pengurangan loading, maksudnya adalah, jika kita menggunakan spoler pada gambar, maka blog kita tidak akan dikenai beban loading yang bisa memberatkan. Tapi tidak hanya gambar lho, video pun bisa menggunakan spoiler agar loadingnya tidak memberatkan blog kita. Spoiler juga berguna sebagai tempat untuk menaruh kode di postingan supaya punya kesan unik, inovatif dan inspiratif.

Lalu bagaimana kalau kita mau menyisipkan gambar ?. Pada prinsipnya sama tinggal masukkan script gambar itu kedalam space dari script dibawah ini :


<div style="margin: 5px;">
<div class="bigfont" style="margin-bottom: 2px;"><input value="Open" style="margin: 0px; padding: 0px; width: 60px;" 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 = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" type="button" /></div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">Masukkan kode yang ingin kamu masukkan di sini</div>
</div>
</div>

Gimana sudah cukup jelaskan, silahkan di coba, siapa tau jadi solusi bua kawan-kawan blogger yang pengen menampilkan gambar atau teks tapi terlalu makan tempat.

Semoga bermanfaat.....

Artikel Terkait: