Bikin Spoiler Di Blogger (Spoiler Script)

Hari ini Bli Tyan akan menuliskan Gimana sih cara bikin spoiler di blogger, tapi sebelumnya saya tanya nih, Udah pada tahu belum nih spoiler itu apa??

Sebenarnya sudah banyak yang posting dan share. Akan tetapi, tidak ada salahnya juga kan jika Bli tyan ikut share tentang spoiler dan sedikit tentang kegunaannya :D

Spoiler dibuat dengan menggunakan javascript button. Sedangkan untuk menyembunyikannnya digunakan properti CSS display, dalam hal ini, "display:none;". Fungsinya ada banyak sekali, diantaranya untuk memperpendek teks atau gambar yang sangat besar/panjang dan memakan space halaman atau untuk menyembunyikan kejutan bagi pengunjung (maka seringkali disebut pula sebagai "peek-a-boo", Indonesianya kurang lebih, "ci-luk-ba!", hehe)
Pada posting blog, spoiler dapat digunakan untuk memperpendek panjang halaman sementara sebelum di-klik oleh pengunjung, sehingga tampak tidak ruwet.

Konten Yang Disembunyikan

Contoh Spoiler :

Teks yang disembunyikan/yang berada di dalam spoiler

Script spoiler ini berfungsi untuk menyembunyikan sebagian tulisan di postingan blog kita, baik itu berupa link download, atau hanya sekedar ingin menyembunyikannya saja.

Biasanya spoiler banyak digunakan di forum-forum

Next ...
Cara Membuat Spoiler Di Blogger

1. Login ke blogger
2. klik add new post (buat artikel baru) kemudian isi artikel teman.

Salin semua kode berikut, kemudian masukkan ke posting atau tempat yang teman inginkan

<div id="spoiler">

<div><input type="button" value="Tampilkan" style="margin:0px;padding:0px;" 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 = 'Sembunyikan'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Tampilkan'; }">

</div>

<div style="background: #ffffff; margin: 10px auto;

border: 0px solid #000;

padding: 5px;">

<div style="display: none;">

Teks yang disembunyikan/yang berada di dalam spoiler

</div>

</div>

</div>

Keterangan :

Ganti tulisan dengan tulisan Teks yang disembunyikan/yang berada di dalam spoiler yang anda inginkan.

Please subscribe, leave a comment, follow this blog and share this article with your friends and colleagues.
by: http://blityan.blogspot.com

Share This On :

Tweet

Related Post :

blogger tutorial

• Tips SEO Dasar Paling Jitu
• Teknik SEO Tingkat Dewa
• Analisa Kecepatan Loading Blog
• DaftarIsi
• Moodle For Dummies
• Cara Membuat Sub Domain Di GoDaddy
• Cara Memuat Page Di Blogger
• Mau Pasang Google Pagerank Button?
• Cara Membuat Tulisan Bergerak ke Atas
• Cara Mengganti Cursor Blog

blogger script

• Menampilkan Tanggal Terbit Posting Pada Hari Yang Sama
• Membuat Efek Tulisan Dengan CSS Text Shadow
• User Online Widget Untuk Blog/Situs
• Widget Featured Slider Otomatis Untuk Blogger
• Membuat Recent Post by Label Thumbnail Saja
• Cara Membuat Tulisan Mengikuti Cursor
• Bikin Recent Post by Label With Thumbnail Script
• Cara Mudah Mengganti Favicon Blogger
• Statistik Kunjungan + User Online Status