Contribute to this guide

guideTutorials

Whether a newcomer to CKEditor 5 or already a seasoned user – be sure to find something useful in the tutorial section. These easy-to-follow, clear, and informative guides will help you better tailor the CKEditor 5 WYSIWYG editor to your specific needs.

# Crash course

If these are your early steps in the CKEditor Ecosystem, feel free to take the crash course and start with the Editor and configuration tutorial, explaining in detail how things work. The course will further introduce you to CKEditor 5 plugins and their creation, explain all about model and schema and how to extend it. There are also guides to data conversion, the editor commands, and finally introduction to user interface explaining how to handle and expand the editor UI. And if that is not enough yet, you will learn how to handle events and observables and keystrokes and how to configure plugins.

# Creating plugins

Start developing your own features on the go with the timestamp plugin tutorial to give you an idea of where to start. Should you want to develop advanced CKEditor 5 plugins, have a look at the Creating Abbreviation Plugin three-step course. It will deep-dive into the internal works of feature plugins. This tutorial will explain in detail the expanding of the model, handling user input, and finally creating commands and expanding the UI.

# Using widgets

Widgets are powerful elements of edited documents and can be used as containers for special content, formatting tools, and for other purposes. Our tutorials will show you how to implement a block widget, and an inline widget, and how to use a React component in a widget. The Data from external source tutorial is yet another approach to extending CKEditor 5 capabilities via an advanced plugin. It is a step-by-step guide through the data input, schema handling, adapting the UI, and injecting the data into editor content.

Keep coming back for new tutorials that will make your CKEditor 5 experience even more satisfactory!