Cara Membuat Spoiler di Blog

Assalamualaikum,,
Cukup lama saya tidak memposting artikel di blog ini, karna sudah masuk kuliah dan sekarang sudah mulai UAS 😝 jadi saya jarang membuat artikel,
cuma memanfaatkan waktu kosong aja.

yoo, langsung kepointnya karna, masih ada urusan lainnya 😛

1. Login ke Blogger > Template > Edit HTML
2. tambahkan CSS dibawah ini.

#flippy {text-align:center;}
#flippy button {margin:10px auto;cursor:pointer;font-weight:700;background-color:#5a6269;color:#fff;padding:10px 20px!important;text-transform:uppercase;border:none;border-radius:3px;opacity:0.9;transition:all 0.3s ease-out;}
#flippy button:hover, #flippy button:focus {outline:none;opacity:1;color:#fff;}
#flippanel {padding:1px;text-align:left;background:#fafafa;border:1px solid #e6e6e6;}
#flippanel {padding:24px;display:none;}
#flippanel img {background:#f5f5f5;margin:10px auto;}

3. lalu tambahkan JavaScript dibawah ini.

//Spoiler www.abdurrahim.id
$(document).ready(function(){$("#flippy").click(function(){$("#flippanel").slideToggle("normal")})});

4. Simpan. Untuk mengfungsikannya, Copy kode dibawah ini ke postingan atau halaman statis kalian.

<div id="flippy"><button>Spoiler</button></div>
<div id="flippanel">
--- TAMBAHKAN KONTEN DISINI ---
</div>

Dan lihat hasilnya,
Demo atau Contohnya bisa klian lihat dibawah ini.

Ini contoh hasil Spoilernya, sama seperti di blog ini. 😀😀😁😂😃😄😅😆😉😊😋😌😌😍😎😏😐😑😒😗😘😬😮😙😲😳

Jika kalian mengalami masalah komen dibawah ae bro.