Saturday, March 20, 2010

Cara membuat spoiler pada blog

Cara membuat spoiler ini sebenarnya bukan hal baru sih. Penggunaan spoiler ini banyak di gunakan di forum atau di Vbuletin. Namun kalau pada blog jarang sekali yang menggunakan spoiler. Padahal dari segi fungsinya jelas membantu banget baik dari segi menghemat space pada artikel post juga dapat mempercepat loading page, karen file yang dalam berukuran besar itu tidak akan tampak apabila tidak di tampilkan, karena adanya spoiler ini. Dalam postingan ini walaupun saya menyadari akan pentingnya spoiler dalam blog saya nanti, maka nggak ada salahnya dong kalau saya menulis tentang cara membuat spoiler pada blog di blog personal saya ini.
Cara membuat spoiler pada blog memang menggunakan kode HTML yang sangat banyak dan rumit, Hmm..seandainya saya juga jurusan IT mungkin agak malas juga kalau setiap hari berurusan dengan kode-kode seperti itu. Tapi berkat adanya para blogger indonesia yang selalu setia membagi ilmunya ke para pemula ini sangat membantu sekali dalam pencarian ataupun dalam pembelajaraan mengenai dunia blogging dan pernak-perniknya. Nah sekarang mumpung saya dapat segelintir informasi dari beberpa teman saya tentang membuat spoiler pada blog. Ada baiknya kalau cara membuat spoiler pada blog ini saya tulis dan simpan di sini, yah buat orang yang pengen ,melihat cara membuat spoiler pada blog silahkan saja ga da yang melarang kok..Nih cara membuat spoiler pada blog:

Copykan kode di bawah pada post versi html ketik ingin memposting sebuah artikel..bukan pada compose

<div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Tentang bla..bla.bla.. </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 spoiler....: Cara membuat spoiler pada BLog  :D
</div></div></div></div>
Nah hasilnya pada blog akan terlihat seperti ini:

Tentang bla..bla.bla..
Isi spoiler....: Cara membuat spoiler pada BLog  :D

Related Posts by Categories



No comments:

Post a Comment