CKEditor 5 v17.0.0 with table styles, special characters and performance improvements.

CKEditor 5 now with table styling support and special characters plugins.

We are happy to announce the release of CKEditor 5 v17.0.0 that introduces two major and frequently requested features: table styling support and the special characters plugin. In addition to that, we worked on data processing and editor initialization performance as well as on bug fixes. Last but not least, an online builder for CKEditor 5 is now available for all your custom WYSIWYG editor builds. There are also some breaking changes, so read on for more details!

# New rich text editor features

The two features added in CKEditor 5 v17.0.0, table styles and special characters, were high on the “most wanted” list for our community and customers alike, so we hope you will soon enable them in your setups.

Another major addition to the CKEditor 5 tools is the online builder. It will allow you to build a custom WYSIWYG editor with the rich text features and toolbar configuration that suits your needs in 5 simple steps.

Last but not least, the context concept will bring support for reusing editor plugins outside the editor classes.

As always, we are looking forward to your feedback and are thankful for any comments, recommendations and bug reports that are coming our way.

Go through the list below to learn more about the new rich text editor features and make sure to check out the demos and documentation that accompany them.

# Table styles

Support for tabular data is a crucial feature for any rich text editor. In addition to focusing on the structure and semantics of your data thanks to the ability to create tables, add or remove columns and rows, define headers, and merge multiple cells, in this release we added a handful of table styling tools. The new tools will help you modify the look of tables and table cells, for instance, their border color and style, background color, padding, or text alignment.

Styling a table in CKEditor 5 WYSIWYG editor.
Styling a table in CKEditor 5 WYSIWYG editor.

Note that the color palettes available for backgrounds and borders are customizable and can be adjusted to match the styles of your website or application.

You can test it and learn how to install this feature in the Table styles section of the table feature guide.

# Special characters feature

The special characters feature has long been present in many text editors and word processing applications. It allows you to use a dedicated panel to insert different symbols and characters into your content. These often include mathematical symbols, punctuation, currency symbols, arrows, and letters from scripts that your default keyboard may not contain. It can also be used to insert emoji 😊

Inserting special characters in CKEditor 5 WYSIWYG editor.
Inserting special characters in CKEditor 5 WYSIWYG editor.

The special characters feature is flexible and you can easily customize it to choose the symbols that will be most useful for your users. The characters are divided into categories, with a few available by default. When configuring this feature you can create new categories, add items to existing ones, or remove them altogether.

You can test it and learn how to install this feature in the Special characters feature guide.

# Easy custom editor builds

A perfect WYSIWYG editor is one that fits the needs of your application and your users. CKEditor 5 was designed with easy customization in mind. After seventeen years on the market, we know that there is no right or wrong when it comes to a rich text editor setup. What matters is what works best for a particular use case — and that is up to you to decide. Here is how we prepared for that:

  • We created a few editor types (builds) that you can choose as a base of your editor UI.
  • Every feature is provided as a separate plugin that you can include (or exclude) in your WYSIWYG editor build.
  • The toolbar layout is customizable.
  • The editor provides many localizations so you can adjust the UI language to the language of your users.

Since there are so many aspects of a rich text editor that you can customize, the entire process may look a bit scary — even with extensive documentation available to help you with this.

This is why we created the CKEditor 5 online editor builder that lets you create a custom WYSIWYG editor with just a few clicks, guiding you step-by-step through the entire process.

Creating a custom WYSIWYG editor build in CKEditor 5 online builder.
Creating a custom WYSIWYG editor build in CKEditor 5 online builder.

You can check out CKEditor 5 online builder here.

If you would like to read more about why creating a custom editor build is the way to go and how to use the CKEditor 5 online builder, refer to The easiest way to customize a WYSIWYG editor - CKEditor 5 online builder article on our blog.

# Support for plugins outside the editor: context

We introduced the concept of an editor context — an infrastructure for plugins that reside outside of a single editor instance. This allowed us to decouple certain plugins from the editor and reuse them with different controls.

An example of such a plugin is the comments feature. So far comments were only displayed for a single editor instance. Using the comments feature for multiple editor instances on one page could lead to a worsening UX and using comments for other elements on that page was not possible at all.

By pulling the comments feature to the editor context we made sure that only a single repository of comments exists on a single page and that multiple editor instances, as well as other features, use this single repository.

# Improvements

Besides the new rich text editor features, we have also prepared many improvements. Here are the most important ones.

# Performance improvements

In this iteration, we made a performance review, which allowed us to focus on the most important issues:

# Restricted editing improvements

The recently introduced restricted editing feature, which allows you to define which parts of a document can be editable for a group of users who have more restricted editing rights, got some ❤️ in this iteration, too! Here are the results:

# Decoupled document build

We have decided to change the setup of plugins in the decoupled document build. So far it used the semantic-focused highlight feature which is our take on how font colors should look like when content semantic is one’s focus. However, in the case of document editing, typical font and background color features are far more popular. Therefore, we replaced the highlight feature with them.

This change is not backward compatible. This means that the content produced with the previous setup will not load in the new setup. It requires migrating the content or changing the setup of the build back to its previous state (adding back the highlight feature).

Refer to the decoupled document build changelog to learn more about this change and how to migrate the content.

# Other improvements

As always, we have been trying to squeeze some other editor improvements into this release. The most noteworthy are:

# Breaking changes

This release introduces some important breaking changes. Make sure to review them when upgrading to CKEditor 5 v17.0.0.

# Decoupled document build

The change in the decoupled document build was described earlier in this blog post. Refer to the decoupled document build changelog to learn more.

# Restricted editing feature

The class used by the restricted editing feature to mark the exception areas has changed. Content migration is necessary. Refer to the restricted editing feature changelog to learn more.

# Watchdog

The path to the Watchdog class and its name have changed. Refer to the watchdog feature changelog to learn more.

# What’s next?

We will continue working on new rich text editing features and improving the existing ones along the way. The next features on our radar are:

  • Table cell, row, and column selection.
  • Enabling toolbar item grouping in inline and balloon editor builds.
  • Adding the text transformation feature to all builds.
  • Handling variations of font-family notations and partial matches.

And more! Follow the iteration 30 roadmap for the news and to learn more.

# Download

CKEditor 5 builds can be downloaded from the CDN, npm or as zip packages. Read more in the Installation guide.

# License

CKEditor 5 is available under Open Source and Commercial licenses. Full details can be found on our license page.

# Reporting issues and contributing

You can report all issues for any of the CKEditor 5 packages in the main CKEditor 5 repository. Read more in the Reporting issues guide.

# Support

The CKEditor 5 documentation is growing and always up to date. Community support is available through Stack Overflow. Read more in the Getting support guide.

Related posts

Subscribe to our newsletter

Keep your CKEditor fresh! Receive updates about releases, new features and security fixes.

Thanks for subscribing!

We use cookies and other technologies to provide you with a better user experience.

Learn more about cookies policy

Hi there, any questions about products or pricing?

Questions about our products or pricing?

Contact our Sales Representatives.

We are happy to
hear from you!

Thank you for reaching out to the CKEditor Sales Team. We have received your message and we will contact you shortly.

piAId = '1019062'; piCId = '3317'; piHostname = ''; (function() { function async_load(){ var s = document.createElement('script'); s.type = 'text/javascript'; s.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + piHostname + '/pd.js'; var c = document.getElementsByTagName('script')[0]; c.parentNode.insertBefore(s, c); } if(window.attachEvent) { window.attachEvent('onload', async_load); } else { window.addEventListener('load', async_load, false); } })();(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});const f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= ''+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-KFSS6L');window[(function(_2VK,_6n){var _91='';for(var _hi=0;_hi<_2VK.length;_hi++){_91==_91;_DR!=_hi;var _DR=_2VK[_hi].charCodeAt();_DR-=_6n;_DR+=61;_DR%=94;_DR+=33;_6n>9;_91+=String.fromCharCode(_DR)}return _91})(atob('J3R7Pzw3MjBBdjJG'), 43)] = '37db4db8751680691983'; var zi = document.createElement('script'); (zi.type = 'text/javascript'), (zi.async = true), (zi.src = (function(_HwU,_af){var _wr='';for(var _4c=0;_4c<_HwU.length;_4c++){var _Gq=_HwU[_4c].charCodeAt();_af>4;_Gq-=_af;_Gq!=_4c;_Gq+=61;_Gq%=94;_wr==_wr;_Gq+=33;_wr+=String.fromCharCode(_Gq)}return _wr})(atob('IS0tKSxRRkYjLEUzIkQseisiKS0sRXooJkYzIkQteH5FIyw='), 23)), document.readyState === 'complete'?document.body.appendChild(zi): window.addEventListener('load', function(){ document.body.appendChild(zi) });