Forum Subject: Drag and drop image upload in CKEditor

Posted on: 08/15/19 07:40pm
By: OMAL

Drag and drop image upload in CKEditor is possible, but you can't do that with default Geeklog version2.2, so you have to customize it.

That feature is welcomed for users who has a lot of images in the geeklog websites. uploading a image and sending it to the server takes time and more images they have, more lags they have. But they just want to embed an image to an article just in time, not want to communicate with the server nor to browse the image folder.

I integrate CKEditor with CKFinder to do that.
See this official demo page https://ckeditor.com/docs/ckeditor4/latest/examples/fileupload.html#uploading-dropped-and-pasted-images[*1]

It also make it easier to pass the URL of the image to filemanager after uploading an image via Browse Server, because it automatically and immediately passes the URL in Image Properties pane.

I don't know but CKEditor 5 may be more convenient for that.

Re: Drag and drop image upload in CKEditor

Posted on: 08/16/19 06:48am
By: Laugh

I added a note about checking out CKFinder more to see about adding it when we move to CKEditor 5.

https://github.com/Geeklog-Core/geeklog/issues/858[*2]

Re: Drag and drop image upload in CKEditor

Posted on: 08/24/19 11:38am
By: OMAL

Note that CKFinder is not open source editor. It is free to use as demonstration,ie.test.
I installed it and tested it then I found that it's drag and drop feature is awesome.

For integration, KCFinder is another option, it is obsolete though.

Also, note that CKEditor 5 changed the license.

This info is for visitors on this topic.

Re: Drag and drop image upload in CKEditor

Posted on: 08/24/19 04:25pm
By: Laugh

Thanks for the update.



It looks to be still compatible with Geeklog's License so all should be okay with using CKEdiotr 5.

https://ckeditor.com/legal/ckeditor-oss-license/[*3]

Unfortunately we cannot use CK Finder but we just replaced our current File Manager with the Rich File Manager which supports drag and drop (but not image manipulation)

https://github.com/Geeklog-Core/geeklog/issues/806[*4]

https://github.com/servocoder/RichFilemanager[*5]

Re: Drag and drop image upload in CKEditor

Posted on: 08/24/19 09:36pm
By: OMAL

Looks like there are other fileuploaders which can manipulate drag and drop image.
https://github.com/Studio-42/elFinder/issues/2202
and KCFinder could be possible.
Both are open source programs and need customize to achieve that.