Cara Memasang Spoiler di Artikel Blog

23.14
Cara Memasang Spoiler di Artikel Blog

Cara Memasang Spoiler di Artikel blog - Spoiler sebenarnya jarang digunakan oleh kalangan blogger. Walaupun begitu bukan berarti tidak ada blog yang menggunakan spoiler ini. Kebanyakan blog yang saya temui menggunakan spoiler ber-niche download, dimana spoiler ini berfungsi untuk menyisipkan link download tersebut agar terlihat rapi dan menarik.
Fungsi utama dari spoiler ini adalah untuk menyisipkan sebuah konten pada sebuah tombol, dan untuk menampilkan konten tersebut kita harus mengklik tombolnya. Selain menyisipkan sebuah link pada spoiler, kita juga dapat menyisipkan sebuah gambar atau pun video dan juga text. Jadi untuk menggunakan spoiler tidak harus blog berniche download saja. Namun bila sobat mesih belum paham bagaimana cara membuat spoiler ini,sobat bisa mengikuti langkah langkah berikut untuk membuat spoiler di blog sobat.

Silahkan login dahulu pada akun blogger >> Template >> Edit html. Cari kode </b:skin> dan letakkan kode berikut tepat diatasnya.


.buttonx{
display:inline-flex;
cursor:pointer;
font-size:13px;
font-weight:bold;
text-transform:uppercase;
box-shadow:0 1px 2px rgba(0,0,0,.2);
color:#FFF!important;
border:2px solid #FFF!important;
background-color:#3366ff!important;
background:0;
margin:3px 0;
padding:5px 15px;
text-shadow:none!important;
transition:all 0s!important;
}
.buttonx:hover{
background-color:#5588ff!important;
background:0
}
.buttonx:active{
position:relative;
top:1px;
background-color:#5588ff!important;
}

Bila sudah,  untuk memasang spoiler pada artikel blog silahkan pastekan kode berikut pada saat sobat membuat artikel tersebut dengan menggunakan mode HTML dan publikasikan.


<button title="Klik untuk melihat/menyembunyikan" class="buttonx" type="button" onclick="if(document.getElementById('spoiler') .style.display=='none') {document.getElementById('spoiler') .style.display=''}else{document.getElementById('spoiler') .style.display='none'}">SPOILER</button>

<div id="spoiler" style="display:none"> 
...Isi Konten... 
</div>

Cukup sampai disini dulu ya artikel "Cara Memasang Spoiler di Artikel Blog" semoga sobat paham betul apa yang jelaskan diatas.Namun bila sobat mengalami kesulitan jangan sungkan untuk berkomentar dibawah.

"Jadilah manusia yang haus akan ilmu dan jangan pernah merasa puas dengan ilmu yang di dapat"

Artikel Terkait

Previous
Next Post »

2 komentar

Write komentar