Rabu, 18 Mei 2011

Cara membuat spoiler atau hiden postingan pada blogger

Mungkin temen-temen pernah lihat dan tentu binggung bagaimana cara nya dan apa namanya dan ini penjelasan dari artikel kali ini.
Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari konten blog kita. Spoiler juga bermanfaat agar konten yang berat seperti gambar dalam ukuran besar dan video tidak diload sebelum menekan tombol show. Dengan kata lain spoiler membantu kita mengurangi waktu load konten blog dan memberikan pilih kepada pembaca blog untuk membuka atau tidak isi spoiler

Anda sudah sering lihat Spoiler di kaskus atau forum-forum untuk nyembunyikan gambar, link dan konten lainnya. Spoiler ada dua yaitu untuk forum misalnya kaskus dan satunya lagi untuk dipergunakan di blog/web. Keduanya memiliki kode yang berbeda.

 Spoiler Forum misalnya KASKUS:
[spoiler=judul spoiler]isi spoiler[/spoiler]

Ganti tulisan yang berwarna hijau sesuai judul dan isi spoiler yang anda kehendaki.
Spoiler untuk blog/web:
Menyembunyikan konten tertentu dari sebuah halaman blog/website diperlukan untuk menghemat space. Ketika visitor ingin melihatnya mereka dapat dengan mudah menampilkannya. Begitupun dalam software forum semacam vBulletin, Spoiler pasti banyak digunakan.

Berikut kode yang bisa digunakan dalam membuat spoiler di blog :

<center><div> judul/keterangan <div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;"> </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"/>
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
isi spoiler atau postingan yang akan di sembunyikan

</div></div></div></div></center>


Cara meggunakannya yaitu pertama login pada blog anda setelah itu pilih new posting. Biasanya kalau kita posting kita langsung pada COMPOSE jiuka kita akan menggunakan spoiler maka kita gunakan yang edit HTML seperti gambar berikut
 Setelah kita siapkan maka kopy scrip di atas tadi dan pastekan di dalam EditHTML dan ubah atau ganti yang berwarna merah dengan kebutuhan anda dan jika mau memosting yang akan di munculkan langsung kita kembali atau klik COMPOSE setelah merasa cukup atau selesai klik PUBLIK POST dan ini hasilnya dari SPOILER




judul/keterangan

disni adalah isi postingan untuk spoiler atau postingan yang akan di sembunyikan dan anda bisa memodifikasi script ini agar sesuai dengan kebutuhan anda
oke..................???????????????




Selamat mencoba dan semoga berhasil dan anda bisa melihat part2

Tidak ada komentar:

Posting Komentar