Summernote merupakan sebuah library Javascript yang dapat membantu dalam membuat editor seperti CKEDITOR. Dalam summernote sendiri merupakan editor WYSIWYG (What You See Is What You Get). Jadi WYSIWYG adalah sebagai aplikasi yang memberikan output atau tampilan sama seperti yang terlihat.

Summernote sendiri dengan UI sederhana sehingga sangat mudah dipakai, selain mengedit text bisa digunakan untuk mengupload gambar. Karena summernote ini merupakan text editor dengan pengkodean base64. Baiklah dalam kasus kali ini saya akan menggunakan Summernote untuk mengupload gambar yang nantinya agar tersimpan dalam suatu folder. Bagaimana cara penggunaan summernote pada codeigniter?

Langkah Pertama

Sahabat persiapakan terlebih dahulu yaitu file :

  • Codeigniter
  • Bootstrap
  • JQuery
  • Summernote

Pada artikel ini saya menggunakan Summernote yang bisa sahabat download disini. Dan buat folder baru pada project kalian yang berisi file bootstrap, jquery, dan summernote ,sahabat silahkan perhatikan rule folder yang akan dibuat berikut tampilannya:

Cara Menggunakan Summernote Pada CodeIgniter

Langkah Kedua

Sahabat jangan lupa untuk konfigurasi pada Codeigniter seperti berikut:

  • file Autoload.php

  • file Config.php

  • file Database.php

Langkah Ketiga

Sahabat buat file Controller seperti code dibawah ini:

Jika sudah langsung saja disimpan agar tidak lupa. Dan selanjutnya saya akan menjelaskan code yang ada di controller :

Pada function save tidak hanya berfungsi untuk menyimpan data ke database, melainkan juga mengambil data yang telah di insert ke database kemudian menampilkannya ke view “post_detail_view”.

Pada function upload_image berfungsi untuk mengupload image dari summernote yang di kirim melalu iAJAX Request. Image yang diupload akan tersimpan di folder “assets/images” yang sebelumnya telah di buat.

Selanjutnya ada fungsi delete_image berfungsi untuk menghapus image yang telah diupload melalui summernote seperti code dibawah ini.

Saya kira cukup dalam pembahasan kali ini dan akan dilanjutkan pada artikel berikutnya, semoga bermanfaat.

terima kasih