Sobat sudah pasti mengenal yang namanya spoiler apalagi yang sering main
di forum-forum. Fungsi dari spoiler ini sangatlah penting, bukan hanya
di forum-forum maupun untuk blog dan jika sobat belum mengerti apa itu
spoiler, saya akan menjelaskan sedikit tentang spoiler ini. Spoiler
adalah tombol yang diguanakan untuk menyingkat tempat atau
menyembunyikan konten (teks, foto atau video) dengan buka tutup.
Selain bisa dipasang pada postingan, spoiler ini juga bisa dipasang di sidebar atau widget. Tinggal bagaimana sobat mengkreasikan sendiri dan kode yang digunakan juga sama serta tidak ada kode tambahan yang dibutuhkan...!!!
Berikut contoh spoiler :
Judul Spoiler:
Cara Menggunakan!
Nah, untuk pembuatan spoiler ini sendiri sangatlah mudah. Berikut langkah-langkahnya :- Login ke blogger
- Pilih New Post atau Entri Baru seperti membuat postingan biasa
- Pilihlah pada mode Edit HTML saat membuat postingan
- Gunakan kode script berikut ini 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</div>
</div>
</div>
- Teks yang berwarna merah di atas bisa sobat ganti sesuai dengan keinginan sobat.
- Pilih Publikasikan atau Pratinjau untuk melihat hasilnya..
Posting Komentar