Image properties dialog in CKEditor 5

user_298479 0
Viewed 31

I recently upgraded from CKeditor 4 to CKeditor 5.

The old one used to have a very nice image properties dialog where you could configure borders etc.:

ckeditor4 screenshot

Unfortunately, CKeditor 5 only has a text field to paste the image URL, and nothing else. There's also a simple toolbar to change floating etc. of images, and the ckeditor image-styles documentation seems to suggest that they prefer people to use semantic styling instead of just setting borders, sizes, etc. directly.

However, this if a huge mess when you have an existing webapp where people were used to the flexibility the old editor gave them.

Is there a config option I missed (or a plugin that can be enabled) in CKeditor 5 to get these advanced image controls back?

ckeditor5 ckeditor
1 Answers

There is a CKFinder plugin for CKEditor5, this should help you get back the functionality that has been lost, here's a link https://ckeditor.com/docs/ckeditor5/latest/features/images/image-upload/image-upload.html#ckfinder

Here's the features of this plugin

CKFinder

The CKFinder feature provides a bridge between the rich-text editor and CKFinder, a browser-based commercial file uploader with its server-side connectors (PHP, Java and ASP.NET).

There are two ways you can integrate CKEditor 5 with the CKFinder file manager:

With the server-side connector only – In this scenario, images dropped or pasted into the editor are uploaded to the CKFinder server-side connector running on your server.

With both the server-side connector and the client-side file manager (recommended) – Images dropped and pasted into the editor are uploaded to the server (like in the first option).

But there are more cool features available, for instance:

  • uploading using the full user interface,
  • browsing previously uploaded images,
  • editing images (cropping, resizing, etc.),
  • organizing or deleting images.

I hope this helps :)

user_123700670
Related