Headlines News :
Home » » Membuat tombol follow twitter di blog | follow me

Membuat tombol follow twitter di blog | follow me

Written By Unknown on Sunday, April 7, 2013 | 2:47 AM

Cara membuat spoiler - Untuk kesempatan siang ini saya akan share tutorial membuat spoiler diblog blogspot maupun bisa juga di wordpress. Spoiler atau sebuah tombol buka  tutup dimana saat kita klik tombol show hide tersebut maka akan keluar sebuah teks atau gambar.

Tombol spoiler sendiri berfungsi untuk memperpendek dan memperingkas tempat. Maka dari itu ikuti terus tutorial saya dalam membuat tombol spoiler seperti pada forum forum ternama.

Anda bisa menggunakan cara membuat spoiler ini pada postingan biasa ataupun pada widget sidebar blog. Baiklah berikut ini cara untuk membuat spoiler.

Langkah pertama yaitu seperti biasanya anda saat menulis postingan pindah ke mode >> HTML >> lalu masukkan kode spoiler dibawah ini.
<div style="margin-bottom: 2px;">Klik Show Untuk Membuka Spoiler
<div style="margin-top: 5px; text-align: center;"><input value="Show" style="margin-top: 5px; 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 style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;">Memasang spoiler di blog sangat mudah  Inilah kode untuk membuat spoiler dengan teks </div></div></div>
Hasilnya seperti dibawah ini :

Klik Show Untuk Membuka Spoiler
Untuk menambahkan script ubah kode yang berwarna merah di atas dan selesai. Sekian dulu tutorial cara membuat spoiler di blog terbaru 2013 ini semoga bermanfaat bagi blog sobat.
Share this article :

0 comments:

Speak up your mind

Tell us what you're thinking... !

Search

 
Support : Creating Website | Johny Template | Mas Template
Copyright © 2011. Om Bogang - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger