category: features
The {@link module:heading/title~Title} feature enables support for adding the title field to your document. It helps ensure that there will always be a single title field at the beginning of your document.
{@snippet features/title}
The title plugin lets you move from the title to the body element using the Tab key, providing form-like experience. When the selection is at the beginning of the first body element, you can go back to the title element using Shift+Tab. You can also use Enter and Backspace keys to move the caret between the title and the body.
The title plugin is integrated with the {@link features/editor-placeholder placeholder} configuration. If you define it, the placeholder text will be used for the body element.
At the moment the placeholder of the title section is hardcoded. If you would like it to be configurable, add 👍 to the relevant issue on GitHub.
To add this feature to your editor, install the @ckeditor/ckeditor5-heading package:
npm install --save @ckeditor/ckeditor5-heading
Then add the Title plugin to your plugin list:
import Title from '@ckeditor/ckeditor5-heading/src/title';
ClassicEditor
.create( document.querySelector( '#editor' ), {
plugins: [ Title, ... ]
} )
.then( ... )
.catch( ... );
The source code of the feature is available on GitHub in https://github.com/ckeditor/ckeditor5-heading.
Read more about {@link builds/guides/integration/installing-plugins installing plugins}.