Cara Mudah Pasang Kotak Spoiler Buka Tutup Pada Postingan Blog

Kali ini saya akan share cara membuat kotak spoiler buka tutup pada postingan blog, langsung saja yah :)
1. Masuk dashbor blogger
2. Pilih pos
3. Klik Entri baru 
4. Pilih HTML
5. Copas Kode di bawah ini pada halaman postingan anda, hasilnya akan seperti ini :

<!---Start code show hide by;"airbeauty886.blogspot.com"---> <div style="margin-bottom: 2px;"> <div style="margin-top: 5px; text-align: center;"> <input 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" style="font-size: 12px; margin-top: 5px; width: 60px;" type="button" value="Buka" /> </div> <div style="background-color: #cccccc; border-bottom: 1px solid #ff0000; border-left: 4px solid #ff0000; border-right: 1px solid #ff0000; border-top: 1px solid #ff0000; margin: 0px; padding: 6px;"> <div style="display: none;"> <span style="color: black; font-style: italic;"> (TULIS DESKRIPSI DISINI) </span></div> </div> </div> <!---End code show hide by;"airbeauty886.blogspot.com"--->

6. Anda bisa mengubah warna untuk diserasikan dengan template blog anda dengan mengganti kode pada

    background nya

7. (TULIS DESKRIPSI DISINI) Silahkan tulis deskripsi yang ingin anda buat dalam kotak spoiler buka tutup ini, 

    jika ingin menampilkan gambar silahkan copas url gambarnya, jika ingin menampilkan kode HTML, dll 

    silahkan di copas disini, biasanya saya kalau ingin menampilkan kode HTML di kotak spoiler ini saya 

    merubah kode "<" menjadi "&lt;" (tanpa tanda kutip) dan kode ">" menjadi "&gt;".  

8. Publikasikan

Mudahkan .....

Happy blogging