Home » web development » Cara Menggunakan Simditor Sebagai Text Editor Web
Cara Menggunakan Simditor Sebagai Text Editor Web
omahkoding.com – Simditor adalah text editor WYSIWYG berbasis browser. Pada kesempatan kali ini omah koding akan mengulas tentang cara menggunakan text editor simditor.
Simditor
Langkah 1 : Download Assets simditor
Donwload assets simditor disini
Langkah 2 : Import file asset ke dalam web
1 2 3 4 5 6 7 |
<link rel="stylesheet" type="text/css" href="[style path]/simditor.css" /> <script type="text/javascript" src="[script path]/jquery.min.js"></script> <script type="text/javascript" src="[script path]/module.js"></script> <script type="text/javascript" src="[script path]/hotkeys.js"></script> <script type="text/javascript" src="[script path]/uploader.js"></script> <script type="text/javascript" src="[script path]/simditor.js"></script> |
Langkah 3 : Textarea
Untuk menggunakan text editor, yaitu menggunakan tag element textarea.
1 |
<textarea id="editor" autofocus></textarea> |
Langkah 4 : Panggil simditor dengan javacript
Agar simditor terpasang di textarea, panggil simditor dengan javscript seperti diabwah ini.
1 2 3 4 5 6 |
<script> var editor = new Simditor({ textarea: $('#editor') //optional options }); </script> |
Untuk lebih detailnya seperti ini:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
<!DOCTYPE html> <html> <head> <title>Simditor</title> <meta charset="utf-8"> <link rel="stylesheet" type="text/css" href="assets/simditor.css" /> <script type="text/javascript" src="assets/jquery.min.js"></script> <script type="text/javascript" src="assets/module.js"></script> <script type="text/javascript" src="assets/hotkeys.js"></script> <script type="text/javascript" src="assets/uploader.js"></script> <script type="text/javascript" src="assets/simditor.js"></script> </head> <body> <div> <textarea id="editor" autofocus></textarea> </div> </body> <script type="text/javascript"> var editor = new Simditor({ textarea: $('#editor') }); </script> </html> |