Saga_United: Membuat Spoiler di Blog

Hmm, kali ini tentang blogging lagi. Tetapi pada dasarnya ini adalah dasar dari Kaskus, jika anda kaskuser pasti anda telah mengerti tentang cara membuat spoiler. Ya, memang spoiler biasa digunakan para kaskuser, tapi tahu atau tidak ternyata blog juga mempunyai spoiler.

Tentunya cara pemasangannya berbeda. Sebelum saya memberi tahu caranya, pertama-tama akan saya jelaskan fungsinya.

Fungsi spoiler pada dasarnya adalah meminimalisasikan(bingung ngetiknya) proses load pada browser (ex : google chrome, mozilla), selain itu spoiler juga dapat mempermudah pembaca untuk memilih ingin membaca isi spoiler atau tidak.

Berikut kode yang bisa digunakan dalam membuat spoiler di blog :

</span></font><span class="Apple-style-span" style="color: rgb(255, 255, 255); font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><div><div style="margin: 5px;"></span></p><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Judul spoiler</span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "></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"/></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><br></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "></div></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><br></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><div class="alt2" style="</span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><span id="IL_AD8" class="IL_AD" style="border-bottom-width: 1px !important; border-bottom-style: solid !important; border-bottom-color: rgb(0, 153, 0) !important; text-decoration: underline !important; background-image: none !important; background-attachment: scroll !important; background-origin: initial !important; background-clip: initial !important; background-color: transparent !important; cursor: pointer !important; position: static; display: inline !important; padding-top: 0px !important; padding-right: 0px !important; padding-bottom: 1px !important; padding-left: 0px !important; float: none !important; font-family: 'Trebuchet MS', Verdana, Arial, sans-serif !important; font-weight: normal !important; font-style: italic !important; font-size: 14px !important; background-position: 0% 50%; background-repeat: repeat repeat !important; ">border</span></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; ">: 1px inset ; margin: 0px; padding: 6px;"></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><br></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><div style="display: none;"></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><br></span><span class="Apple-style-span" style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; "><br></span><div style="font-family: 'Trebuchet MS', Verdana, Arial, sans-serif; font-size: 14px; font-style: italic; line-height: 23px; ">isi spoiler...</div><br><p><font class="Apple-style-span" face="'Trebuchet MS', Verdana, Arial, sans-serif" style="font-size: 14px; line-height: 23px;"><span class="Apple-style-span" style="font-style: italic; "></div></div></div></div>

Kode HTML diatas akan memberikan hasil seperti dibawah ini: