How to set the external links to be open in the new tab by default, i.e., set target=_blank in CKEditor 5? This short note shows you how to set the configuration in CKEditor 5 on both in HTML code and React Component.
CKEditor 5 does not ship with Code Blocks by default, but it could be added via custom build. The simplest way to use it is from ckeditor5-build-classic-dna. However, it does not support Syntax Highlighting. The good thing is that it's fairly easy to add one via the front-end library, like prismjs.
CKEditor5 is fully customizable. Some of them could be done by CKEditor custom build, some of them could be done by custom plugins, and some of them could be simply done by config. In this article, we will learn how to customize CKEditor 5 Toolbar for React App.
Different from CKEditor 4, you cannot edit the source code to add whatever HTML code to the content you are editing in CKEditor 5. But sometimes, we do want to have a bit more control over the content generated by CKEditor. Good news, we have "ckeditor5-build-classic-dna" came with a plugin to allow us to add custom CSS classes to <table> and <img>.
It has been a while since I last updated my first ever NPM package: ckeditor5-build-classic-dna. Since the office CKEditor5 has been updated to version 30.0.0, I think it's good to keep ckeditor5-build-classic-dna up to date.