Cara Membuat Spoiler Menu Pada Blog Untuk Mengirit Ruang Blog
Dipostkan Oleh. BlogTermssifat dari spoiler ini sendiri adalah.. menyimpan sebagian tulisan anda dengan cara Buka dan Lipat. maksudnya jika anda lipat maka tulisan anda tidak akan terlihat.. dan untuk memperlihatkannya kembali anda tinggal klik maka akan terbuka..
Kegunaannya ialah untuk mempersingkat apabila tulisan anda sangat panjang..dan ini akan mengirit ruangan dalam Blog postingan anda.
Example :
Judul atau isi konten
Untuk Membuat atau Memfungsikan Spoiler Ini pada blog, ikuti langkah-langkah berikut ini..
1. Login Pada Blog anda
2. Pilih Design
3. Lalu Pilih Page Element.
4. Lihat Code Script dibawah ini.. Edit terlebih dahulu seperti yang sudah dijelaskan di dalam code tersebut.
CODE SCRIPT :
<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul atau isi konten </span></i><input value="Show" 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"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
Isi dari spoiler atau Konten anda<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul atau isi konten </span></i><input value="Show" 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"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
</div></div></div></div>
5. Setelah anda Mengedit seperti yang sudah diberitahukan pada Code/Script, Lalu pastekan code tersebut ke ADD Widget anda.. tentunya Setelah anda memasukan Article Yang ingin Anda Spoiler.
Semoga Berhasil dan Sukses.. Salam Blogger..!
Labels: Blogger, Tips dan Trik blog