image-upload-with-ckeditor-laravel

Image upload with CKEditor using Laravel 5.3

If you want to add editor in your application CKEditor is the best choice. Lots of features are available in this editor. By using these features you can format the text what ever you want. Image uploading feature also there. And also integration into your application also very simple. In this article  i would like to explain integration of CKEditor in laravel 5.3.

step 1 : download ckeditor 

You can download from this link http://ckeditor.com/download

step 2 : download kcfinder for image uploading

You can download from this link http://kcfinder.sunhater.com/download

step 3 : Move the files

create ‘ckeditor’ folder inside ‘public’ directory and move both ckeditor and ckfinder files. Unzip these two files and rename ‘kcfinder-master’ as ‘kcfinder’.

step 4 : Add configurations

Open ‘config.js’ file which is located in ‘public/ckeditor/ckeditor/’ folder and add below code.

step 5 : Change CKFinder configuration

Open ‘public/ckeditor/ckfinder/conf/config.php’ file and change ‘disabled’ => true’ to ”disabled’ => false’.

step 6 : routing

step 7 : View

create ‘index.blade.php’ file inside ‘resources/views/ckeditor’ folder and add below code.

sample screenshorts :

By default all the uploaded images are stored in ‘public/ckeditor/ckfinder/upload/images/’ folder. You can change the path what ever you want.

ckeditor-integration-with-image-uploading1

 

ckeditor-integration-with-image-uploading2-png

 

ckeditor-integration-with-image-uploading3-png

 

  • Ashish

    I tried your way to insert the image in laravel 5.3 but unable to do it. It gives me error as –
    NotFoundHttpException in RouteCollection.php line 161: in RouteCollection.php line 161
    Can you point me out what may be the problem? Thanks in advance.