Cara Membuat HTML Editor di Blog dengan Mudah – Dalam membangun sebuah blog, terkadang kita memerlukan yang namanya HTML Editor, entah itu untuk melakukan demo artikel atau kita gunakan untuk menguji coba script yang kita buat. Sebenarnya apa sih HTML Editor itu? HTML editor adalah sebuah form yang digunakan untuk melihat hasil atau output dari sebuah kode HTML. Sebenarnya sudah banyak website yang menyediakan HTML editor secara online. Tapi jika kita bisa membuat sendiri kenapa harus membuka web orang lain?
Dengan membuat HTML editor di blog kita, hal tersebut juga berpotensi menambah visitor blog kita. Dikarenakan banyak sekali blogger yang memerlukan HTML editor ini sehingga HTML editor ini banyak yang mencari. Apabila HTML editor kita berada di Page One, tentu kita akan mendapatkan benyak pengunjung dari situ. Lalu bagaimana sih cara membuat HTML editor diblog dengan mudah?
Cara membuat HTML editor diblog dengan mudah
Dikarenakan banyak sekali keuntungan membuat HTML editor diblog kita, akan lebih baik jika kita membuatnya sendiri di blog kita. Bagaimana sih caranya membuat HTML editor? Caranya cukup mudah kok. Langsung saja.
1. Pertama, kalian masuk dulu ke dashboard blogger anda.
2. Setelah itu buat halaman baru, dengan cara klik Halaman -> Halaman Baru -> HTML
3. Pastekan kode diini pada kotak HTML yang telah disediakan
<div style="text-align: center;">
<b><a href="http://www.bloggerkoplo.com/" target="_blank"><span style="font-size: large;">HTML Editor</span></a></b></div>
<form method="post" name="form1">
<textarea name="code" onclick="focus(this.code)" style="border: solid 1px #cccccc; box-shadow: 5px 5px 5px #CCCCCC; color: black; font-family: Courier New, Monospace, Courier; font-size: 14px; font-weight: normal; height: 200px; margin: 0px; padding: 5px; scroll: auto; width: 100%;"></textarea></form>
<div style="text-align: center;">
<button onclick="preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">Preview</button><button onclick="window.document.form1.code.value='';preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">Clear </button><span style="color: white;">
</span></div>
<div style="text-align: center;">
<span style="color: white;">
</span></div>
<span style="color: white;"><iframe frameborder="0" name="preview" src="about:blank" style="background: #ffffff; border: solid 1px #cccccc; box-shadow: 5px 5px 5px #CCCCCC; height: 70px; padding: 5px; width: 100%;"></iframe></span>
Masukan kode di kolom HTML |
4. Publikasikan, Hasilnya kira kira akan menjadi seperti ini.
Hasilnya seperti ini |
Yak, kira-kira seperti itulah cara untuk membuat HTML Editor di blogger. Dengan membuat HTML Editor di blogger, anda dapat dengan mudah untuk melakukan edit HTML tanpa memerlukan aplikasi tambahan. Dengan begitu proses edit HTML anda menjadi lebih cepat dari biasanya. Selain itu, HTML Editor yang ada diblogger juga sangat ringan untuk digunakan.
Jika anda tertarik dengan tutorial mengenai blogger lainnya, jangan lupa untuk membaca artikel saya yang berjudul cara mempercepat loading blog dengan lazy load. Semoga artikel saya kali ini bermanfaat bagi anda. Terimakasih telah berkunjung di www.bloggerkoplo.com. Salam koplo.
bang tambahin tutorial ny plus css dan javascript donk mirip codepen. tapi yang tanpa tombol preview nya bang.. makasih
Siap mas, ditunggu ya