Menambah Tombol Open / Close pada Blog

Dini hari ini saya akan menunjukkan bagaimana sobat dapat menambahkan tombol Open / Close untuk blogger. Jadi konsepnya adalah menyembunyikan beberapa file sobat dan untuk melihatnya sobat harus mengklik Open / Close tombol. Tombol ini dapat banyak membantu dan menyimpan konten Anda dari spammer, tukang copas dll Tombol ini terbuat dari CSS dan HTML.

Anda juga dapat mengubah teks Open / Close dengan pilihan yang Anda inginkan. Anda dapat menyembunyikan file seperti gambar, kode, file audio, link meng-upload dll dengan tombol ini. Dalam tutorial kode ini terbuat dari banyak elemen CSS yang akan mengubah ukuran / memotong gambar besar. Demo desain ini dapat dilihat di bawah.

Demo

Di bawah ini adalah langkah-langkah untuk menambahkan tombol ini untuk blog Anda

Tambah HTML/CSS

Untuk menambahkan tombol ini di posting sobat pergi ke tab HTML editor dan tambahkan kode di bawah ini.

<div id="spoiler" style="display: none;">

KONTEN / ISI.

</div>
<button onclick="if (document.getElementById('spoiler').style.display == 'none') {
    document.getElementById('spoiler').style.display = ''
} else {
    document.getElementById('spoiler').style.display = 'none'
}">Open/Close</button>

Setelah menambahkan HTML hanya mengedit dan menambahkan file tersembunyi yang dapat Anda lakukan dengan melihat langkah di bawah ini.

Menyiapkan tombol

Ganti KONTEN / ISI dengan konten yang ingin sobat sembunyikan dengan tombol Open / Close.
Ganti Open/Close dengan teks yang diinginkan yang ingin ditampilkan pada tombol.
Sekian tutorial singkat ini, semoga membantu anda dalam dunia internet.