Pilih Warna Baground Yang Anda Suka
Latest

Membuat Spoiler Pada Blog

kevinservis 28 Mar 2013

Sobat sudah pasti mengenal yang namanya spoiler apalagi yang sering main di forum-forum. Fungsi dari spoiler ini sangatlah penting, bukan hanya di forum-forum maupun untuk blog dan jika sobat belum mengerti apa itu spoiler, saya akan menjelaskan sedikit tentang spoiler ini. Spoiler adalah tombol yang diguanakan untuk menyingkat tempat atau menyembunyikan konten (teks, foto atau video) dengan buka tutup. 

Selain bisa dipasang pada postingan, spoiler ini juga bisa dipasang di sidebar atau widget. Tinggal bagaimana sobat mengkreasikan sendiri dan kode yang digunakan juga sama serta tidak ada kode tambahan yang dibutuhkan...!!!

Berikut contoh spoiler :
Judul Spoiler:
Letakkan teks atau kode script (gambar atau video) di sini

Cara Menggunakan!

Nah, untuk pembuatan spoiler ini sendiri sangatlah mudah. Berikut langkah-langkahnya :
  • Login ke blogger
  • Pilih New Post atau Entri Baru seperti membuat postingan biasa
  • Pilihlah pada mode Edit HTML saat membuat postingan
  • Gunakan kode script berikut ini untuk membuat spoiler:
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Judul Spoiler</b>: <input value="Buka" style="margin: 0px; padding: 0px; width: 55px; font-size: 12px;" 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 = 'Buka'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">
Letakkan teks atau kode script (gambar atau video) di sini
</div>
</div>
</div>
  • Teks yang berwarna merah di atas bisa sobat ganti sesuai dengan keinginan sobat.
  • Pilih Publikasikan atau Pratinjau untuk melihat hasilnya..

 

 

Share this article :

Ditulis Oleh : kevinservis ~ http://kevinservis.blogspot.com/

Artikel Membuat Spoiler Pada Blog ini diposting oleh kevinservis pada hari 28 Mar 2013. Terimakasih atas kunjungan Sobat serta kesediaan Sobat membaca artikel ini, Kritik dan saran dapat Sobat sampaikan melalui kotak komentar , Mohon jangan pasang Link hidup di komentar contoh Link hidup google , yahoo , bing , alexa yang diperbolehkan di kotak komentar contoh Link http://blogspot.com Terimakasih



Artikel terkait:

 

Posting Komentar

 
Copyright © 2013. Cikevin - All Rights Reserved
Powered By Blogger