CARA MEMBUAT SPOILER KEREN DI BLOG

Hai sobat mungkin banyak dari kita yang bertanya2 apa si itu sopiler ,,hehe kelihatan asing ea dengernya padahal kita sering ketemu di forum2 dan blogger yang menggunakan spoiler ini sobat

    CARA MEMBUAT SPOILER KEREN DI BLOG

sebelum saya memulainya saya jelaskan sedikit
Spoiler adalah cara untuk menyembunyikan text, script, gambar, ataupun video yang berfungsi untum menghemat ruang pada artikel blog. Tidak hanya itu, spoiler juga berfungsi untuk mempercepat loading blog anda

Tutorial Membuat Spoiler Keren

---

1. Buka akun blogger
2. Pilih menu Template > Edit HTML
3. Cari kode ]]></b:skin>. Kemudian letakkan kode ini tepat diatas kode ]]></b:skin>

#spoiler {
 text-align:center;
}
#spoiler button {
 margin:10px auto;
 cursor:pointer;
 font-family:'Open Sans',sans-serif;
 background-color:#009688;
 color:#fff;
 padding:10px 15px!important;
 text-transform:uppercase;
 border:none;
 border-radius:3px;
 opacity:0.9;
 transition:all 0.3s ease-out;
}
#spoiler button:hover, #spoiler button:focus {
 outline:none;
 opacity:1;
 color:#fff;
}
#spanel {
 padding:1px;
 text-align:left;
 background:#fafafa;
 border:1px solid #e3e3e3;
}
#spanel {
 padding:24px;
 display:none;
}
#spanel img {
 background:#f5f5f5;
 margin:10px auto;
}

4. Cari kode </body>. Lalu letakkan kode ini tepat diatas kode </body>

<script>
$(document).ready(function() {
    $(&quot;#spoiler&quot;).click(function() {
        $(&quot;#spanel&quot;).slideToggle(&quot;normal&quot;);
    });
});
</script>

Kemudian simpan template

Penerapan Spoiler pada Postingan

---

<div id="spoiler"><button>Spoiler</button></div>
<div id="spanel">
--- TAMBAHKAN KONTEN DISINI ---
</div>

Bagaimana mudahkan? Demikian Tutorial CR Cara Membuat Spoiler Keren pada Postingan yang dapat di terapkan di blog anda. Terus ikuti tutorial lainnya hanya di CR. Selamat mencoba..