Comments outside editor? CKEditor 5 Collaboration Features v17.0.0 with new comments API and new possibilities

A lot has happened on the collaboration front in CKEditor 5, so we are very excited to share the results of the work that we have done in recent months with you. If you were dreaming of having a really tight integration of CKEditor 5 collaboration features with your application and being able to add comments to elements outside the WYSIWYG editor, the latest release is for you!

# Collaboration Features changelog

Before discussing the latest features, we would like to let you know that the CKEditor 5 Collaboration Features changelog is now available online to inform you about all the new features and fixed issues.

Make sure to regularly check it for a full list of changes that are introduced in each new release.

# The new comments API - open and powerful

In this release, we mostly focused on improving the comments feature API.

Until now, comments were strictly linked to a single rich-text editor instance. The feedback we received told us that our customers would like to:

• Have a better user experience for web pages with multiple editor instances in a form of one sidebar, one presence list per page, not per editor instance.
• Be able to use comments outside of the editor instance to offer a unified experience across all parts of their applications.

As a result, we improved the API to give developers the possibility to operate on comments programmatically, from the outside of the editor instance and separately from the WYSIWYG editor content.

The most important changes are:

• Comments plugins and related plugins became context plugins. This enables using them without initializing an editor instance as well as with multiple editor instances. The Context class plays a big role in the new improvements, allowing the comments plugins to work “on top” of the editor instances.
• We introduced the CommentsRepository class with the API to create, remove and manage comments for deeper integration with your application.
• The Annotations class API was made public and described in the documentation. This allows for creating your own user interfaces to manage annotations, like a custom sidebar with comments and suggestion balloons.
• The users presence list plugin and the sidebar UI became context plugins. This means that you can have one common presence list and sidebar for all the editor instances.
• Comments can now be attached to any DOM element or coordinates.
• The config.collaboration.channelId property was introduced in place of the config.cloudServices.documentId option used earlier.

# Comments in multiple editors and on non-editor fields

All the changes discussed above mean that you can now create a really tight integration between your application and CKEditor 5 with its collaborative features. They give you a lot of power and flexibility to create a unified experience for your users, with comments added to multiple WYSIWYG editor instances or other elements of your application, displayed together in a common UI.

In the screenshot below you can see an example of such setup, with two editor instances and some form fields sharing a common sidebar and users presence list.

You can also play with a similar configuration in the demos available in the new guides.

We believe that these improvements will bring a lot of value to your application and make the collaboration experience even more seamless and natural. The unified collaboration setup can prove particularly useful in scenarios where several people work simultaneously on complex forms that let you create medical records, legal documents or technical documentation with attachments, tags, categories or references set through non-editor fields.

If you are interested in this kind of integration, refer to the new CKEditor 5 collaboration features guides that also include the demos of the new possibilities:

• Context and collaboration features
• Comments outside the editor

We also provide complementary, ready-to-use samples that showcase these integrations. There is a regular integration sample and an Angular integration sample available.

# Track changes

Multiple new CKEditor 5 features were integrated with the track changes feature. Image resize, soft line break, horizontal line, page break, and restricted editing will now work with change tracking enabled. Also, the new special characters plugin is available in suggestion mode, too!

We also improved descriptions for suggestions related to tables. Now they contain text content that is added or removed.

Finally, the track changes API description was moved to the new place in the documentation.

# What’s next?

In the next release, we will focus on the stability of the collaboration features, mainly in regards to the new comments API and connection issues.

Do not forget to check out what cool new features we have introduced in CKEditor 5 this release and stay tuned for the upcoming releases!