Get to Know CKEditor 5 in Drupal 10

CKEditor 4 reached end of life on 31st December, 2023. With this being in progress the Drupal community introduced CKEditor 5 in Core with Drupal 9.5 so as to provide users the chance to use it and plan a migration path for custom plugins. While CKEditor 4 continued to work with Drupal 9 versions, the project was removed from Drupal Core in Drupal 10. CKEditor5 is now the default editor that gets shipped with Drupal 10 Core.

CKEditor 5 has little to do with its predecessor in terms of programming implementation since its completely rewritten from scratch. Let's look at the features CKEditor 5 offers :

• Improved User Interface
• Media Widget with dedicated toolbar
• Tables with dedicated dropdown with options
• Improved Styles dropdown.
• Track Changes, Revision History [Premium Features]
• Real time collaboration, comments [Premium Features]
• Export to PDF & Word [Premium Features]

CKEditor 5 has provided a direct migration path from CKEditor 4 with zero coding efforts and no data loss. This makes it handy for users who are using CKEditor 4 as it is shipped with a little or no use of contributed plugins. For sites using advanced or customised plugins, they need to be migrated and upgraded as per CKEditor 5 specifications.

How To Prepare For CKEditor 5

• Find or determine which modules provides CKEditor 4 plugins other than Drupal Core using the following approaches :
  • Approach 1 : 
    • "cd web/modules"
    • "grep -R CKEditorPlugin"
  • Approach 2 :
    • Install a contributed module that provide a report of all CKEditor plugins used on the site and which module is creating the plugin.
    • https://www.drupal.org/project/ckeditor_plugin_report

• Once you have a list of plugins that are created and by which Contributed module, you can find if they have a CKEditor 5 compatible plugin that you can use just by upgrading the identified contributed module.
  • https://www.drupal.org/docs/core-modules-and-themes/core-modules/ckeditor-5-module/upgrade-coordination-for-modules-providing-ckeditor-4-plugins

• If the plugin is provided by a custom module or is fullfilling a specific feature for the site, follow the below process to port the plugin to CKEditor 5
  • Refer the following link to Port CkEditor 4 plugin
  • https://www.drupal.org/docs/core-modules-and-themes/core-modules/ckeditor-5-module/upgrading-modules-extending-ckeditor-4-to-support-ckeditor-5

• Install CKEditor 5
  • Once all Contributed and custom modules are updated to CKEditor 5 compatible version, it will be possible to upgrade text formats to CKEditor 5
  • Now, go ahead and install the CKEditor 5 module provided by Drupal Core.

• Upgrade text formats to Use CKEditor 5
  • Navigate to the text formats configuration page at : `admin/config/content/formats`
  • Edit each of the text formats and update the "Text Editor" dropdown value to "CKEditor5"
  • Save the text formats
  • This will trigger the migration process and will provide status message on the status of migration.

• Validate your configurations and pages with CKEditor.
• Uninstall CKEditor 4 module.
• Done.