7 Langkah Mudah Membuat dan Memasang Spoiler pada Artikel atau Layout Blog, Seperti di Kaskus

 Assalamu’alaikum..

               Spoiler. Kata spoiler diindonesia memang sudahlah banyak terdengar. Spoiler itu sendiri saya tau ketika seorang teman saya yang seorang kaskuser berkata "no spoiler". Waktu itu sih ada film yang bagus dan memang saya ingin bercerita pada teman saya itu tapi teman saya itu malah bilang "no spoiler".

                 Lalu saya cari apa sih itu spoiler, ternyata spoiler itu membeberkan atau membocorkan isi cerita. Dalam kaskus sendiri, ketika di klik "buka", maka akan terbuka isi konten dalam artikel tersebut, dan ketika di klik "tutup", maka akan tertutup/tidak terlihat.

               Jadi, Kalo menurut saya pribadi sih, Spoiler itu digunakan untuk menyembunyikan dan menampilkan konten (gambar, teks, ataupun video) dengan sistem buka tutup (udah kaya jalur puncak hehehe ), agar tidak boros tempat atau dengan kata lain menghemat tempat dan pastinya mengoptimasi loading artikel.

             Taukah sobat ? ternyata dalam blogger juga ada looh Spoiler yang sama seperti dikaskus itu, dan enaknya lagi, spoilernya itu bisa diletakkan dalam artikel blog. Penggunannya pun mudah sob. Penasaran bagaimana cara membuatnya ?

yuks simak.. : 7 Cara Mudah Bagaimana Memasang/Membuat Spoiler Di Blog :

1.         Login ke Blogger sobat. Klik Disini , masuk ke blogger.

2.         Lalu akan menampilkan gambar dibawah :

Lihat Gambar:

3.          Klik “New Entry” disebelah kiri atas. Lalu pilih mode “Edit HTML”, seperti gambar dibawah :

Lihat Gambar:

4. Copy Paste kode script dibawah, pada mode "Edit HTML", untuk membuat spoiler :

<div style="margin: 5px 20px 20px;">

<div class="smallfont" style="margin-bottom: 2px;"><b>Judul 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 = 'Buka'; }" type="button">

</div>

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

<div style="display: none;">

Letakkan teks atau kode script (gambar atau video) di sini

 <br>

</div>

</div>

</div>

5.  Sobat dapat mengganti kata Judul Spoiler sesuai kehendak kalian, begitu juga Buka dan Tutup.

6. untuk dapat melihat sebelum di Publish, klik “Compose” maka tampilannya akan seperti ini :

Lihat Gambar:

7. Setelah sobat yakin dengan Spoiler-nya, silahkan klik "Publish/Publikasikan", Selesai deh.. :D

NB : Spoiler ini bisa juga loh dipasang di Layout,
caranya : klik “Layout - add gadget - html/java script”.. dan tinggal masukin script diatas tadi.. ^^

          Mungkin itu saja Berbagi Pengetahuan tentang  7 Langkah Mudah Memasang/Membuat Spoiler pada Artikel Blog. Apabila ada kesalahan kata dan kurang berkenan pada penjelasannya, mohon dimaafkan. Semoga artikel ini bisa bermanfaat, terima kasih atas kunjungannya.. ^^

selamat mencoba.. !!

Wassalamu’alaikum..

Tweet

Jika Menyukai Artikel di blog ini, Silahkan masukkan email sobat. Akan dapat Update artikel dari blog ini, "GRATISS!!"