Cara Membuat Form Text Editor Posting Dengan CKEditor.


Cara Membuat Form Text Editor Posting Dengan CKEditor.

CKEditor adalah semacam library yang di bangun dari dengan javascript. untuk memudahkan kita dalam membuat form posting/text editor pada form. jadi dengan ada nya text editor ckeditor ini kita bisa membuat form posting seperti pada blogspot atau wordpress. kita bisa membuat text tebal, text heading dan lain-lainnya dengan sangat mudah. karena ckeditor mengandung unsur WYSIWYG(What You See Is What You Get).

Ada beberapa jenis pilihan untuk menggunakan CKEditor diantaranya:

  • versi basic      : memiliki fitur yang sederhana dan ukuran filenya pun kecil. DOWNLOAD
  • versi standard : memiliki fitur sedang.DOWNLOAD
  • versi full         : memiliki fitur yang lengkap.DOWNLOAD 

Berikut saya akan berikan cara menggunakan CKEditor:
  • extrak file yang telah di download.
  • lalu buat file index.html didalamnya ini hanya buat percobaan selanjunya.

  •  dan isi file inde.html dengan syntax dibawah ini:

<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript" src="ckeditor.js"></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
       <div class="kotak">
<textarea class="ckeditor" id="ckedtor"></textarea>
<br/>
<button class="tombol">Simpan</button>
</div>
</body>
</html>

Perhatikan pada contoh di atas, ada beberapa point yang harus kita lakukan. yaitu pertama menghubungkan file html dengan file ckeditor.js yang terdapat dalam folder ckeditor.

 <script type="text/javascript" src="ckeditor.js"></script>

Lalu yang kedua berikan class dan id pada element textarea.

<textarea class="ckeditor" id="ckedtor"></textarea>

Ok! jika sudah selesai silahkan dicoba di browser kalian... 
Cara Membuat Form Text Editor Posting Dengan CKEditor. Cara Membuat Form Text Editor Posting Dengan CKEditor. CKEditor adalah semacam library yang di bangun dari dengan javascript . untu...

Artikel Terkait

Berikan Komentar

  1. Untuk menulis kode gunakan <i>KODE</i>
  2. Untuk menyisipkan kode ke dalam Syntax Highlighter gunakan <em>KODE YANG LEBIH PANJANG</em>
  3. Kode harus di-parse terlebih dulu agar bisa ditulis.
  4. Centang Notify me untuk mendapatkan notifikasi balasan komentar melalui Email.
histats