Tutorial Membuat Spoiler pada Blog

Baca Juga

Mahir Blogger-Postingan ini saya buat karena setelah saya melakukan blogwalking, cari inspirasi, jalan-jalan melihat begitu dinamisnya inovasi dalam dunia blogger saya sering menemukan di dalam blog yang saya dapati atau baca terdapat spoiler.

Apa itu spoiler ? Ini juga baru saya tahu,kalau yang saya lihat dulu itu, yang menarik perhatian saya spoiler namanya. Saya jelaskan sedikit tentang spoiler. Spoiler adalah tombol yang dapat digunakan untuk menyingkat space atau ruang dalam postingan blog teman-teman. Spoiler dapat membuka dan menutup untuk menyembunyikan pesan, gambar, bahkan video. Spoiler ini dapat membuat orang menjadi bertanya-tanya, apa isi dari spoiler yang nanti saya buka ini. Biasanya, para blogger juga menyalahgunakan fungsinya dengan menampilkan di dalam spoiler berupa gambar-gambar porno, hikkss...ngeri. Semoga fungsi spoiler ini, teman-teman tidak salah gunakan untuk hal-hal seperti itu.

Nah, berikut saya ingin berbagi kepada teman-teman bagaimana “Tutorial Blogger” dalam Membuat Spoiler pada Blog. Langsung saja praktekkan, yuk ikuti setahap demi setahap :

 

1. Seperti biasa. Login dulu ke Blogger 
2. Pilih New Post atau Entri Baru seperti membuat postingan biasa. Buat sedikit artikel atau postingan. Kalau pada kesempatan ini saya membuat tutorial blog ini.
3. Pilihlah pada mode Edit HTML saat membuat postingan 
4. Gunakan kode script berikut ini untuk membuat spoiler :   
   </div>
   </div><div style="margin: 5px 20px 20px;">
   <div class="smallfont" style="margin-bottom: 2px;"><b>Nama Spoiler yang ingin dibuat</b>: <input value="Buka atau Open" 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 = 'Close atau 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>
   
5. Kita dapat mengganti Judul Spoiler sesuai keinginan kita, begitu juga Buka dan Tutup, bisa menggunakan Open atau Close. Tergantung Pilihan Anda. Okey.
6. Sebelum meng-Klik Publish atau Terbitkan Entri jika sudah selesai. Baiknya klik dulu Prantinjau untuk memastikan tutorial blog ini berhasil Anda jalankan dengan baik. Okey. Kalau berhasil, langsung saja klik Publish atau Terbitkan Entri / Publikasikan Entri.

Sebagai contoh Spoiler di atas, hasilnya seperti berikut :

Nama Spoiler yang ingin dibuat:

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

Okey, sudah tahukan ...? Semoga tutorial blog saya tentang "Tutorial Membuat Spoiler pada Blog", dapat Anda praktekkan. Semoga bermanfaat. Salam Mahir Blogger

Mohon Perhatian

Terima kasih atas kunjungan Anda di mahir blogger. Hubungi kami jika Anda menemukan konten/postingan

yang rusak/tidak terbaca. Silahkan beritahu kami dengan menulis pesan

pada kotak komentar. Kami akan berusaha menanggapi dan memperbaiki konten

tersebut secepatnya. Saran, kritik, dan komentar Anda sangat berharga buat kami. Terima Kasih, Contact on : mahirblogger@gmail.com.