Selasa, 10 Januari 2017

Cara Membuat Kotak Script / Spoiler Teks Dalam Artikel Blog

Membuat Kotak Spoiler Teks / Script Dalam Artikel Blog - seringkali saat kita menulis sebuah artikel blog apa lagi dengan niche tutorial blog biasanya kita akan memberikan sebuah kode atau script kepada pengunjung dan jika kita hanya menggunakan cara biasa artikel dengan script akan kelihatan berantakan karena sudah berbeda tulisan dengan kode.
Kotak buka tutup dalam artikel blog

Dan kali ini saya akan share untuk membuat script atau tulisan yang kita sorot pada artikel menjadi lebih rapih. Yaitu dengan cara memasukan kode atau tukisan yang kita bagikan kedalam sebuah kotak yang dapat dibuka tutup didalam artikel blog. Langsung saja berikut caranya.

Langkah Membuat Kotak Script Dengan tombol Buka Dan Tutup :


1. Buat Entri Baru yang ingin diposkan.



2. Copy Kode yang ada dibawah ini .

<div style="margin-bottom: 2px;"><div style="margin-top: 5px; text-align: center;"><input value="Buka" style="margin-top: 5px; width: 100px; font-size: 12px;" 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'; }" type="button"> </div><div style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;">
GANTI DENGAN TULISAN ATAU SCRIPT SOBAT DISINI
</div></div></div><br> <br> <br>

contoh kotak scriptnya :

Sample Contoh Kotak Script by Fathanblogger.net

3. Setelah dicopy ubah mode "Compose" ke mode "HTML" , Lalu pastekan ditempat yang diinginkan.
Kotak buka tutup artikel blog

4. Publikasikan Entri dan lihat hasil yang telah Anda buat.


Kutipan : Ganti tulisan yang saya beri warna merah dengan tulisan atau kode yang mau diletakan.


Itulah cara membuat kotak script didalam postingan blog. Jika kurang mengerti bisa ditanyakan lewat komentar facebook yang ada dibawah artikel saya ini.

Sekian dari saya , Terimakasih.

Tidak ada komentar:

Posting Komentar