Cara Menambahkan Plugin TinyMCE (Upload Gambar) Pada Framework Laravel

Membuat sebuah CMS, rasanya tidak lengkap jika tidak menggunakan fitur WYSIWYG (wiswig) dimana kita bisa menulis artikel dengan tools layaknya ms word. Banyak plugin WYSIWYG yang kamu bisa gunakan, salah satunya adalah TinyMCE. Nah, kali ini saya akan mengajarkan bagaimana mengintegrasikan dalam fremawork laravel, jadi pastikan teman-teman sudah menginstalnya.

Berikut adalah step by stepnya:

1. Download TinyMCE

Download plugin di https://www.tinymce.com/, usahakan pakai versi terbaru yakni v4. Jika sudah masukan folder tinymce di dalam framework laravel di folder public/js (terserah).

2. Instal plugin upload image

TinyMCE sendiri tidak menyediakan fitur upload image untuk versi yang free, jadi kita harus memakai plugin dari luar. Silahkan download pluginnya di http://justboil.me/. Kalau sudah download, ekstrak, copy foldernya, pindahkan ke dalam tinymce/plugins/, setelah dipaste rename nama folder menjadi jbimages.

Kemudian kita integrasikan ke dalam framework laravel, di dalam main_layout.blade.php (view), paste kode/perintah JS ini (didalam tag head).

Karena yang itu gambar, jadi teman-teman silahkan copy di sini http://justboil.me/ (TinyMCE 4.x Example).

Kalau sudah teman-teman tinggal buat saja form textarea.

3. Config

Tinggal kita set up alamat folder untuk menyimpan file gambar, pada tinymce/plugins/jbimages/config.php.

Alamat foldernya di public ya...

Selesai!, kalau berhasil nanti hasilnya seperti ini.