Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di die-silver.blogspot.com

Cara Membuat Spoiler di Blog

Apakah yang dimaksud dengan spoiler itu sendiri? Kenapa harus menggunakan spoiler dalam pem-blogging-an? Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, seluruh atau sebagian isi dari postingan blog kita, dan lain-lain. Spoiler ini juga bisa menguntungkan kita dalam hal pengurangan loading, maksudnya adalah, jika kita menggunakan spoler pada gambar, maka blog kita tidak akan dikenai beban loading yang bisa memberatkan. Tapi tidak hanya gambar lho, video pun bisa menggunakan spoiler agar loadingnya tidak memberatkan blog kita. Spoiler juga berguna sebagai tempat untuk menaruh kode di postingan supaya punya kesan unik, inovatif dan inspiratif.

Untuk pemasangannya, kita bisa menggunakan dua langkah dengan masing-masing contohnya. Check it out!!!

  1. Model Pertama



    Apakah yang dimaksud dengan spoiler itu sendiri? Kenapa harus menggunakan spoiler dalam pem-blogging-an? Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, seluruh atau sebagian isi dari postingan blog kita, dan lain-lain. Spoiler ini juga bisa menguntungkan kita dalam hal pengurangan loading, maksudnya adalah, jika kita menggunakan spoler pada gambar, maka blog kita tidak akan dikenai beban loading yang bisa memberatkan. Tapi tidak hanya gambar lho, video pun bisa menggunakan spoiler agar loadingnya tidak memberatkan blog kita. Spoiler juga berguna sebagai tempat untuk menaruh kode di postingan supaya punya kesan unik, inovatif dan inspiratif.


    Pada model ini anda harus menggunakan script berikut ini:
    <div style="margin: 5px;">
    <div class="bigfont" style="margin-bottom: 2px;"><input value="Open" style="margin: 0px; padding: 0px; width: 60px;" 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 = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" type="button">
    </div>
    <div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;">Apakah yang dimaksud dengan spoiler itu sendiri? Kenapa harus menggunakan spoiler dalam pem-blogging-an? Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, seluruh atau sebagian isi dari postingan blog kita, dan lain-lain. Spoiler ini juga bisa menguntungkan kita dalam hal pengurangan loading, maksudnya adalah, jika kita menggunakan spoler pada gambar, maka blog kita tidak akan dikenai beban loading yang bisa memberatkan. Tapi tidak hanya gambar lho, video pun bisa menggunakan spoiler agar loadingnya tidak memberatkan blog kita. Spoiler juga berguna sebagai tempat untuk menaruh kode di postingan supaya punya kesan unik, inovatif dan inspiratif.</div></div></div>
  2. Model Kedua
    Model ini agak berbeda dengan pada Model Pertama, karena menggunakan variasi background pada content-nya. Berikut contohnya:



    Apakah yang dimaksud dengan spoiler itu sendiri? Kenapa harus menggunakan spoiler dalam pem-blogging-an? Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, seluruh atau sebagian isi dari postingan blog kita, dan lain-lain. Spoiler ini juga bisa menguntungkan kita dalam hal pengurangan loading, maksudnya adalah, jika kita menggunakan spoler pada gambar, maka blog kita tidak akan dikenai beban loading yang bisa memberatkan. Tapi tidak hanya gambar lho, video pun bisa menggunakan spoiler agar loadingnya tidak memberatkan blog kita. Spoiler juga berguna sebagai tempat untuk menaruh kode di postingan supaya punya kesan unik, inovatif dan inspiratif.


    Bagi yang tertarik model berikut bisa meng-copy script berikut ini:
    <div style="margin: 5px;">
    <div class="bigfont" style="margin-bottom: 2px;"><input value="Open" style="margin: 0px; padding: 0px; width: 60px;" 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 = 'Close'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Open'; }" type="button">
    </div>
    <div class="alt2" style="border: 0px; margin: 0px; padding: 6px;"><div style="display: none;"><div style="background: rgb(180, 123, 16) none repeat scroll 0% 0%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial;">Apakah yang dimaksud dengan spoiler itu sendiri? Kenapa harus menggunakan spoiler dalam pem-blogging-an? Spoiler itu adalah sesuatu yang dipakai untuk dapat menyembunyikan link, gambar, seluruh atau sebagian isi dari postingan blog kita, dan lain-lain. Spoiler ini juga bisa menguntungkan kita dalam hal pengurangan loading, maksudnya adalah, jika kita menggunakan spoler pada gambar, maka blog kita tidak akan dikenai beban loading yang bisa memberatkan. Tapi tidak hanya gambar lho, video pun bisa menggunakan spoiler agar loadingnya tidak memberatkan blog kita. Spoiler juga berguna sebagai tempat untuk menaruh kode di postingan supaya punya kesan unik, inovatif dan inspiratif.</div></div></div></div>


Untuk tulisan berwarna merah dan hijau pada tutorial di atas bisa Anda ganti sesuka Anda. Bisa diisi dengan kode gambar, video, link, posting, atau apa saja terserah Anda. Yang penting tutoral ini bisa membantu Anda. Selamat mencoba dan semoga berhasil!!!

Jika Anda menyukai Artikel di blog ini, Silahkan klik disini untuk berlangganan gratis via email, dengan begitu Anda akan mendapat kiriman artikel setiap ada artikel yang terbit di die-silver.blogspot.com
Gunakan Tombol berikut untuk menyimpan halaman :
Cara Membuat Spoiler di Blog
menjadi format PDF dan lebih maksimal jika terdapat kesalahan koneksi atau yang lainnya.

..::Artikel Menarik Lainnya::..

17 comments:

RiP666 July 28, 2009 at 10:56 PM  

wahh keren jg sob, nice tips ^^

Love's Diary July 29, 2009 at 5:13 PM  

thanks infonya. nanti akan Ai coba^^

Unknown July 30, 2009 at 2:56 AM  

salam kenal ya..
info menarik bro..

BeeMouNTaiN July 30, 2009 at 11:27 AM  

ardie.... daku mampir neh..tips nya aku coba nanti di postingan teranyar ya..

dwi c July 31, 2009 at 10:39 AM  

seep...dah di coba makasih yaa..happy blogging.

Denny July 31, 2009 at 4:15 PM  

sepertinya spoiler ga akan pengaruh dalam mengurangi loading time deh. :)

johan wijaya July 31, 2009 at 5:02 PM  

sepp tipsnya...coba praktekin ah :)

digital megapixel July 31, 2009 at 7:24 PM  

main sembunyi sembunyi rupanya..hehee

Fanda July 31, 2009 at 8:41 PM  

Makasih ya infonya. Kebetulan aku mo posting yg fotonya banyak, lf bingung cari cara spoiler, eh ketemu postingmu ini. Kalo utk gambar, yg dimasukkan kode apanya ya? Dapetnya gimana?

Mengenai Alexa, sama juga. Dulu punyaku 167ribu-an. Sekarang malah 193rb. Ga tau kenapa.

chill-fu.net August 1, 2009 at 11:24 PM  

mas, kalu untuk wordpress gmn ya?
saya tertarik nih mau pake spoiler

ardi33 August 2, 2009 at 6:23 AM  

@Fanda: kalo pengen masukin gambar, tulisan merah atau hijau ganti pake script gambar...pake <img src="urlgambar">

@chill-fu.net: wah, kalo wordpress sya kurang tau sob. Saya juga mau memperdalam tapi kayaknya susah. Hehe...

Tiar Bahtiar August 3, 2009 at 2:53 PM  

http://sites.google.com/site/diesilversite/smileys/AddEmoticons04217.gif

mancing gembira August 5, 2009 at 7:05 PM  

waduh nambah ilmu perblogan. thanks yah sharing ilmunya.
salam mancing

antwa August 8, 2009 at 5:07 AM  

pengen nyoba ah.....thank's bro! :n:

Unknown August 16, 2009 at 6:25 PM  

Wah...menarik....infonya

Celetukan Segar August 19, 2009 at 1:16 AM  

Saya sudah mencoba kedua model untuk gambar.
Namun pada pemakaian model kedua, ada warna oranye di pinggir gambar, apa karena gambarnya kecil, ya?

rully taraka August 28, 2009 at 1:55 PM  

interesting!!
coba ah.....

Post a Comment

Silahkan menuliskan komentar anda pada opsi Google/Blogger untuk anda yang memiliki akun Google/Blogger.

Silahkan pilih account yang sesuai dengan blog/website anda (LiveJournal, WordPress, TypePad, AIM).

Pada opsi OpenID silahkan masukkan URL blog/website anda pada kotak yang tersedia.

Atau anda bisa memilih opsi Nama/URL, lalu tulis nama anda dan URL blog/website anda pada kotak yang tersedia.

Jika anda tidak punya blog/website, kolom URL boleh dikosongi atau dapat juga diganti dengan email anda.

Gunakan opsi 'Anonim' jika anda tidak ingin mempublikasikan data anda. (sangat tidak disarankan). Jika komentar anda berupa pertanyaan, maka jika anda menggunakan opsi ini tidak akan ditanggapi. Lebih baik anda gunakan pilihan dibawah ini:

Jika ingin komentar anda tidak dipublikasi, silahkan klik disini.

Terima kasih, komentar anda sangat berarti untuk die-silver.blogspot.com
:a: :b: :c: :d: :e: :f: :g:
:h: :i: :j: :k: :l: :m: :n:

newer post older post home

About Me

My Photo
ardi33
Sangat bercita-cita menjadi seorang webmaster yang selalu dapat memberikan yang terbaik dan bermanfaat kepada semua orang, dan sekarang sedang dalam tahap pembelajaran yang tak kenal lelah!!!
View my complete profile

Stats

Blog Rank:Powered by  MyPagerank.Net
Traffic Rank:Alexa Certified Site Stats for http://die-silver.blogspot.com
Online Visitor:
Blogger Template by Ardi33.Web.id.
Originally Die Silver Template Edited by TemplateZone