Artikel Yang Paling Populer

Tuesday, September 29, 2009

Cara Membuat Spoiler Pada Blog

| Tuesday, September 29, 2009 | 16 comments

Spoiler biasanya digunakan untuk memperkecil atau mempersingkat kode, postingan, atau tulisan apapun agar tidak terlalu memenuhi halaman.Spoiler ini dapat anda pasang pada side bar, halaman posting, header dan footer.Untuk membuatnya tidaklah sulit,anda tinggal mencopy kode dibawah ini.
Berikut contoh spoiler.

Contoh Spoiler:

INI ADALAH CONTOH SPOILER



Cara membuat spoiler ini adalah sebagai berikut:
1.Copy dan paste kode dibawah ini
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b> Untuk lihat <b>Script</b>: <input value="Lihat" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" 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 = 'Lihat'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Isi kode script, HTML dan teks anda disini

<br>
</div>
</div>
</div>
2.Selanjutnya gantilah tulisan yang yang berhuruf tebal dan berwarna hitam dan merah.
Width: 55px adalah lebar kotak spoiler.Gantilah sesuai kebutuhan anda.
font-size: 11px adalah ukuran huruf dalan kotak spoiler.Dapat diganti sesuai kebutuhan.
Tutup dan Lihat dapat anda ganti sesuai keinginan anda
Isi kode script, HTML dan teks anda disini dapat anda ganti dengan teks atau kode script.
Silakan mencoba.

Tutorial Blog-Blog Islam-Cara Membuat

16 comments:

Kang Dedy said...

Wah... boleh juga nih buat jadi bahan praktek

Info yang bermanfaat sobat!!!

Seti@wan Dirgant@Ra said...

makasih infonya sobat.

Hafizu said...

hi sob.. ap kbr? makasih tutorial nya... kunjungan balik ditunggu :)

newbi said...

wah skr udah jadi master blogging nih
banyak bgt tipnys
congrats

hill said...

mantabb nih triknya, sy coba tutorialnya, :)

salam
hill

TRIMATRA said...

mau nanya aja, spoiler ini ada manfaatnya ga ya buat mempercepat halaman di load browser?

Franky said...

@setiawan dirgantara,hafizu,newbi,hill,kang dedy,
Terima kasih atas kunjungan anda dan beri koment.Salam balik
@trimatra, nggak ada pengaruh kok.Untuk meminimalisir tempat pada blog saja menurut saya.

Babesajabu said...

Nah, ini dia yang saya cari2, ternyata ketemunya disini.

Franky said...

@babe, silakan diaplikasikan..

Yep said...

Wah thanks nih pencerahannya....
Tapi klu wp ngak bisa ya ? :)

Tutorial desain grafis said...

IJIN COPAS YAH... TQ...

Franky said...

@yep,sama-sama deh
@tutorial desain grafis, silakan di copas

kaptenagil said...

makasih infonya...

Ayo Rame-rame “Vote Indonesia” di ajang BBC World Challenge ‘09

Forum Iklan Gratis Sepuasnya said...

Luar biasa OM / Mbak Marcsya

Gita puspitasari said...

cool ^^ ,please visit my blog guys^^

Jefry said...

dengan spoiler jadi makin ringkas ya

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

Followers

 
© Copyright 2010. yourblogname.com . All rights reserved | yourblogname.com is proudly powered by Blogger.com | Template by o-om.com - zoomtemplate.com