Cara Pasang Spoiler Di Postingan Blog

Cara Pasang Spoiler Di Postingan Blog

Cara Pasang Spoiler Di Postingan Blog - Kata Spoiler pasti tidak akan asing bagi para pengguna Kaskus, Spoiler berfungsi agar gambar atau video tidak langsung muncul agar menghemat kuota data internet. Coba saja upload gambar atau di forum - forum Kaskus tanpa Spoiler, siap-siap saja dapat Bata.

Nah, kali ini I AM RYLL 09 akan memberikan tips sederhana Cara Pasang Spoiler Di Postingan Blog dengan efek menarik pastinya. Yuk simak caranya:

Cara Pasang Spoiler Di Postingan Blog

• Login ke Blogger tercinta
• Template > Edit HTML
• Copy Paste kode dibawah ini tepat diatas kode ]]></b:skin> atau </style>

#flippy {
    text-align: center;
}

#flippy button {
    background: #aa65c7;
    color: #fff;
    text-align: center;
    margin: 0 auto;
    border: none;
    border-radius: 3px;
    padding: 8px 16px;
    margin: 10px auto;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0px 3px 0px 0px #883da7;
    vertical-align: middle;
    cursor: pointer;
    text-shadow: 0 1px rgba(0, 0, 0, 0.3);
    transition: background 0.1s ease-in-out;
}

#flippy button:hover, #flippy button:focus {
    background: #9e4fbf;
    outline: none;
}

#flippanel {
    padding: 1px;
    text-align: left;
    background: #f5f5f5;
    border: 0px;
}

#flippanel {
    padding: 24px;
    display: none;
}

• Lalu Copy Paste kode dibawah ini keatas kode </body>

<script>
$(document).ready(function() {
    $("#flippy").click(function() {
        $("#flippanel").slideToggle("normal");
    });
});
</script>

• Kemudian anda terapkan kode dibawah ini pada Tab HTML

<div id="flippy"><button>Cekidot</button></div>
<div id="flippanel">
---SILAHKAN ISI KONTEN ANDA TERAPKAN DISINI---
</div>

Contoh penerapan:

• Demo

Demikian artikel ini Cara Pasang Spoiler Di Postingan Blog, semoga bermanfaat bagi Nusa dan Bangsa.