by 
Mengganti Textarea HTML Dengan CKEDITOR Sebagai Editor WYSIWYG
Sebelum masuk ke bagian tutorial, saya akan mencoba untuk menjelaskan sedikit tentang judul tersebut. Textarea sendiri merupakan sebuah komponen yang biasanya digunakan untuk menulis sebuah tulisan yang lebih dari satu baris, atau bisa dikatakan banyak baris, seperti sebuah paragraph. Tentunya untuk textarea yang biasa hanya bisa menuliskan sebuah huruf dasar dan standard saja, tanpa ada editan seperti miring atau tebal. Oleh karena itu digunakanlah sebuah editor WYSIWYG.
WYSIWYG (What You See Is What You Get) yang artinya apa yang kamu lihat adalah apa yang kamu dapatkan, yaitu merupakan suatu editor yang memungkinkan pengguna dapat mengedit tulisan, seperti mengubahnya menjadi huruf tebal, miring, garis bawah, mengatur rata kanan, kiri, tengah, dan masih banyak yang lainnya.
Editor WYSIWYG untuk sebuah textarea sebenarnya juga banyak, seperti TiniMCE, CKEditor, FTB(FreeTextbox), dan lainnya. Akan tetapi, yang akan saya bahas dalam postingan ini adalah CKEditor.
Baiklah, untuk memulai tutorialnya, langsung saja seperti dibawah ini, dan tutorial ini saya tujukan untuk yang masih pemula, karena saya juga masih pemula. Untuk para pro dan master mohon bantuannya bila ada salah dalam postinga saya. :D
1. Pertama, buatlah sebuah folder dengan nama terserah, disini saya membuatnya dengan nama "cobaEditor".
2. Kemudian sediakan sediakan tool yang diperlukan, yaitu : JQuery, bisa di download di website resminnya disini, kemudian CKEditor juga dapat dodownload pada website resminya disini.
3. Untuk mendownload CKEditor bisa dipilih terserah mau yang basic, standard ataupun yang full package. Saya disini mencoba untuk menggunakan yang Full Package. Kemudian untuk download jQuerynya klik Download the compressed, production jQuery 3.2.1, lalu akan muncul halaman yang banyak tulisannya, dan klik kanan saja pada halaman tersebut, lalu pilih Save Page As... dan pilih lokasi untuk menyimpan, lalu klik save, maka jQuery terlah ter-download.
4. Setelah di download semua, copy jQuery yang telah di download tadi ke folder yang telah dibuat, dan saya menggunakan contoh folder tadi yaitu "cobaEditor". Selanjutnya adalah CKEditor, berhubung CKEditornya masih dalam bentuk WinRAR ZIP, maka extract dulu, dan copy hasil extract tadi ke folder "cobaEditor".
5. Kemudian buka notepad atau notepad++, dan masukkan kode dibawah ini :
<html>
<head>
<title>Menggunakan Editor CKEditor</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript" src="ckeditor/ckeditor.js"></script>
<script>
$(function () {
CKEDITOR.replace('teks');
});
</script>
</head>
<body>
<form method="POST" action="">
Masukkan Tulisan : <br/>
<textarea id="teks" cols="30" rows="7"></textarea><br/>
<input type="submit" value="Selesai">
</form>
</body>
</html>
Kemudian, simpan ke folder "cobaEditor" dengan nama file "index.html". Untuk bagian "CKEDITOR.replace('teks');", CKEDITORnya jika menggunakan huruf kecil tidak bisa, dan harus menggunakan huruf kapital.
6. Setelah itu, jika sudah disimpan, coba buka file "index.html"yang telah dibuat tadi.
7. Jika hasilnya seperti pada gambar dibawah ini, maka sudah berhasil.
Sekian postingan CKEditor dari saya, semoga dapat membantu, mohon maaf jika masih banyak kesalahan, dan mohon dikoreksi jika masih banyak kesalahan. Terimakasih telah berkunjung.
