Membuat Spoiler di sidebar. mungkin nama spoiler sangat kental dan identik dengan situs forum terbesar di Indonesia, dan sudah lama bisa dipasang pada blog. mungkin tutorial ini hanya sekedar repost untuk menjawab pertanyaan dari sahabat HAPIA Mesir.
Sebelumnya HAPIA Mesir telah menerima Tag Blog Dan Award dari sahabat-sahabat HAPIA Mesir.
Sebelumnya HAPIA Mesir telah menerima Tag Blog Dan Award dari sahabat-sahabat HAPIA Mesir.
Tutorial membuat spoiler di sidebar ini sepenuhnya untuk menjawab pertanyaan dari Mbak Reni tadi malam (waktu Mesir). dari sekian banyak script spoiler, script inilah yang paling cocok untuk dipasang di sidebar. berikut caranya :
- Login keBlogger dengan account anda.
- Pergi ke "Tata Letak".
- Silahkan klik "Tambah Gadget" dan pilih "HTML/JavaScript".
- Copy paste code berikut ini kedalamnya :
- Login keBlogger dengan account anda.
- Pergi ke "Tata Letak".
- Silahkan klik "Tambah Gadget" dan pilih "HTML/JavaScript".
- Copy paste code berikut ini kedalamnya :
<center><div><input style="margin: 0px; padding: 0px; width: 100px;" value="Lihat Isi" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Hide Link!'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'Hide'; }" type="button">
<div id="show" style="border: 0px; margin: 0px; padding: 4px; display: none; width: 350px;">
CODE GADGET ANDA YANG DISEMBUNYIKAN
</div></div></center>
Dan hasilnya seperti ini (klik tombolnya):
* Untuk code spoiler yang bisa "BUKA/TUTUP" silahkan memakai code berikut :
# Ganti "Lihat Isi" dengan kata yang anda inginkan.
# width: 100px; adalah lebar tombol spoiler.
# width: 350px; adalah lebar area isi spoiler.
Makasih untuk tutorialnya kawand...
Thanks banget...., aku coba dulu ya... Ntar kalau udah berhasil aku balik lagi, utk laporan. ^_^
Rock@ sama2 kawan...
Mbak Reni@ sama2 mbak..semoga membantu...
hebaaattt
Alhamdulillah berhasil.., tapi yg bisa aku buat cuma popular post. Soalnya yg lain pake gadget dari Blogger.. yg tak pake HTML/Java Script
makasih kawan ...nie yang tak cari cari .....shheeeppp dah
Mbak Reni@ iya mbak..terbatas untuk yg punya code saja..tapi utk gadget dari google yg bisa make code bisa dimasukkan juga mbak...
maksih mas hapia...
ana copas y ntuk ana koleksi..
salam sobat
wah spoilernya lucu-lucu dan keren nich,,
saya juga pingin buat spoiler di didebar.
trims sharingnya.
:) ea keren neh sob
ym ol dong sob T.T
siiplah sebagai penambah koleksi tips trik dari blogger, ok izin copy...
ALL@ semoga bermanfaat...
mantap sobat, kalau untuk foto gimana caranya?
iswady@ kalo utk foto tinggal tarus code fotonya di bagian tulisan CODE GADGET ANDA YANG DISEMBUNYIKAN.
keren nih tp alangkah lebih bagus kalau spoiler di pasang di sidebar, bordernya dihilangkan saja
kode seperti ini border-style: solid; dirubah jadi seperti ini border-style:;
terus kode yang ini border-width: 1px; dirubah jadi seperti ini border-width:; pasti lebih keren kalau g pakai border "sekedar tambahan aja"
wah makasih infonya.....
akhirnya ketemu juga.....
Okeh.. kita coba praktek sekarang,, thanks
Rizky2009@ makasih sobat... iya lebih baik bordernya dihapus untuk dipasang disidebar..
Tips yang sangat menarik dan bermanfaat, ijin copy sahabat. Salam
asalamualaikum...
ahah spoilernya mantep sob..
oh iy thanks buat tag blog nya saya jadikan PR dl sob
nanti insyaalah saya kerjakan..
sukses slalu sobat!
assalamu'alaikum
ijin copas sob
buat percobaan di blog
sukses selalu dah pokoknya
Alhamdulillah..., sekarang tampilan blogku tak terlalu panjang lagi.
Hanya tinggal recent comment yg tak bisa aku 'pendekkan'
Bagaimana..., apakah sudah jauh lebih baik ?
Terima kasih banyak atas bantuannya.
Bunglon Blog & Zamzami Saleh@ waalaikum salam sobat...silahkan..semoga bermanfaat...
mbak reni@ iya mbak...sama-sama...senang bisa membantu..sudah saya lihat..jadi g terlalu panjang lagi..
thx 4 share ^^
bs utak atik nie
have a nice day ^^
Wah keren mas HAPIAH untuk info spoilernya..
trims nih atas ilmunya sangat membantu.
sukses selalu n tetap semangat
Terima kasih ilmunya bro :)
tak praktekin sob,, artikel bermanfaat nich
iya ternyata tutor kita sma..
BUAT SPOILER
keren sob... nice info
terimakasih informasi nya sob :)
menurut saya spoiler pada sidebar tidak ada fungsi khusus selain mencoba memasukan item/bagian pada tempat tertentu dengan unsur pemaksaan, hihihihi.... maksudnya begini ; spoiler digunakan biasanya untuk tidak langsung menampilkan gambar/item yg ingin dipublikasikan dengan beberapa alasan tertentu misalnya : menghemat bandwith, memperkecil jangkauan pemandangan pada monitor/webite untuk tetap fokus pada apa yg ingin disampaikan/dituliskan pada website, sedikit trick yg bermaksud utk aksesoris...
selain alasan tadi diatas, penggunaan spoiler hanya untuk have fun saja. padahal jika kita mengunjungi website dengan tujuan "web/blog apa sih?" boro-boro untuk liat spoiler, untuk mengisi komentar yang sesuai dengan isi postingan aja kadang sudah jarang ditemukan....
btw, nice infonya.... maap panjang bgt hihihihi
udung@ terima kasih atas opininya. panjang juga gpp..
memang bergitu beberapa tujuan penggunaan spoiler pada sidebar..
mungkin jika kita menilai dari pengunjung sesama blogger memang fenomenanya seperti itu..akan tetapi terkadang juga kita mempertimbangkan pengunjung selain blogger..yang mana memang mereka sampai ke blog kita karena mencari informasi...jadi akan berguna..dan diperhatikan oleh mereka jika mereka merasa membutuhnya mencari..
selain juga menghemat tempat..juga berguna memperpendek blog/site yang kelihatan terlalu panjang...demi kenyamanan pengunjung juga...bukan hanya sesama blogger...
waaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaahhhhhhhhhhhhhhhhhhh,,,,,,,,,,,,,,,,,,,,,,,
terbantu sekali aku...
makasih yah kak >=)
.info dan tutorial yang simpel dan mudan untuk di terapkan...kalau boleh tukeran link...s3neng banget rasanya ya...,bisa tukeran tink kn mas?? link blog ini sudah saya pasang diblog saya (a-mobile-blogger.blogspot.com) and tentunya thanks atas share info y..