Sudah lama saya tidak membagikan tips dan trik mengenai blog, pada kesempatan kali ini saya akan kembali membagikan suatu tips yang mungkin sudah banyak teman-teman blogger lainnya postingkan pada blog mereka. Namun tidak ada salahnya saya kembali membagikan tips ini, barangkali masih ada sahabat blogger yang membutuhkan.
Oke, tips kali ini adalah bagaimana Cara Membuat Sploiler Pada Blog, sebelumnya kita harus tahu apa itu sploiler ?? Sploiler adalah suatu fasilitas yang dapat digunakan pada blog untuk menghemat ruang atau space pada blog, lalu bagaimana bisa ?? Sploiler ini akan menyembunyikan isi dari sploiler, apakah itu photo, tulisan, dan lainnya, dan kita dapat melihatnya hanya dengan meng klik tombol show sploiler tersebut, mudah bukan. Selain berfungsi untuk menghemat space blog, sploiler juga dapat berfungsi mempercepat loading page suatu blog. Di bawah ini adalah cara bagaimana membuat Sploiler pada Blog.
<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul Sploiler</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 Sploiler
</div></div></div></div>
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul Sploiler</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 Sploiler
</div></div></div></div>
Cara penggunaan: Copy kode sploiler di atas dan anda bisa meletakkan sploiler pada widget atau pada postingan blog, bahkan juga bisa di forum-forum. Tuliskan judul dan isi dari sploiler sesuai dengan keinginan anda.