When editing some fields of content in your admin interface, you are interacting with a small piece of software called: CKEditor. We are moving from version 4 to version 5. There are numerous changes to how the editor looks and feels, but functionality and workflow should be roughly the same.

We have tried to make as little change as possible, while moving to the latest version of CKEditor which will be supported for years to come. We'd like to take the opportunity to highlight some of the changes that will hopefully make your editing experience faster and easier, whilst also recognising those areas where previous workflows might need to change.

Automatic formatting of bold/italic/lists

If you type out lists starting with numbers or asterisks the editor will convert that into a proper list for you. Similar functionality will make text italic or bold you if surround it with asterisks/underscores, or make titles of the appropriate level if you start a line with # characters.

You can, of course, continue to use the buttons in the toolbar, but these changes help you to focus on writing content without your hands having to leave the keyboard to select formatting options using a mouse/trackpad.

Inline editing for links and images

When adding a link to some content, the editor now presents the various options in a different format, and the options are reduced to the ones that the CMS explicitly supports. 

If you click on a link in the editor, you can now more easily see what is being linked to, and are presented options for editing or removing the link in an inline popover.
Images now get useful inline popovers that offers options for editing alt text.

Styles can only apply to the relevant elements

Applying styles now looks quite different, and the name of the style is now clearly show as well as a better preview of what it looks like. For example, if you want to apply blue styling to a header, you will need to make the header first (e.g. changing a paragraph to be a Heading 2), and then you will be able to apply the relevant styling.