User friendly adalah suatu hal yang sangat penting dalam membangun suatu website atau aplikasi berbasis website, kita sebagai developer harus tahu kebutuhan dari user dan bagaimana desain yang baik untuk usersesuai dengan kemauan user itu sendiri, disini saya akan mengajarkan tentang cara mudah memasang ckeditor plugin didalam textarea.
Sekarang timbul pertanyaan, apa itu ckdeitor, ckeditor merupakan salah satu plugin WYSIWYG (what you see is what you get), dimana dengan menggunakan plugin ini kita dapat dengan mudah menuliskan text berdasarkan keinginan kita sesuai dengan software microsoft office word, jadi dengan plugin ini user awam pun dapat mengoprasikannya,karena toolsnya kurang lebih sama dengan office word, nah mungkin kita langsung saja pada praktek bagaimana cara memasangnya.
Pertama-teman teman-teman harus mempubyai plugin ckeditor yang dapat teman-teman download disini website resmi ckeditor http://ckeditor.com/, jika sudah teman-teman bisa ekstrak ckeditor.zip yang tadi teman-teman download, lalu buat 1 folder dan letakan forlder ckeditor tadi didalam folder yang baru saja kita buat, lalu sekarang teman-teman bisa buat file html didlam folder tersebut dan ketikan script berikut ini :
<!document html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="ckeditor/contents.css" type="text/css"/>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
</head>
<body>
<label><b>Artikel</label>
<textarea rows='15' name='artikel' id='content'></textarea>
<script type='text/javascript'>
var editor = CKEDITOR.replace('content');
CKFinder.setupCKEditor(editor, 'ckfinder/');
</script>
</body>
</html>
Step pertama kita harus mereload library yang dibutuhkan yaitu core dari jquery yang dapat kita ambil dari jquery.com lalu kita menghubungkan library jquery ckeditornya beserta cssnya, jika teman-teman save maka hasilnya akan seperti berikut ini :
gimana teman-teman, cukup mudah bukan, dengan menggunakan ckeditor ini kita dapat membuat bentuk inputan seperti halnya word pada ms office, oke teman-teman saya kira untuk tutorial kali ini tentang cara mudah memasang ckeditor plugin didalam textarea cukup sampai disini dulu, semoga tutorial yang singkat ini dapat bermanfaat untuk teman-teman semuanya, sampai bertemu lagi pada tutorial berikutnya, ingat, jangan pernah bosan untuk terus belajar.
Terima kasih