Select all
The SelectAll
feature allows selecting the entire content of the WYSIWYG editor using the Ctrl/⌘+A keystroke or the toolbar button.
# Demo
Press Ctrl/⌘+A or use the toolbar button to select the entire content of the editor. Note that when editing an image caption, the selection will only expand to the boundaries of the caption.
# Installation
This feature is enabled by default in all builds (loaded by the Essentials
plugin). The installation instructions are for developers interested in building their own, custom rich text editor.
To add this feature to your editor, install the @ckeditor/ckeditor5-select-all
package:
npm install --save @ckeditor/ckeditor5-select-all
Then add the SelectAll
plugin to your plugin list:
import SelectAll from '@ckeditor/ckeditor5-select-all/src/selectall';
ClassicEditor
.create( document.querySelector( '#editor' ), {
// Load the plugin.
plugins: [ SelectAll, ... ],
// Display the "Select all" button in the toolbar.
toolbar: [ 'selectAll', ... ],
} )
.then( ... )
.catch( ... );
# Common API
The SelectAll
plugin registers the 'selectAll'
UI button component and the 'selectAll'
command implemented by SelectAllCommand
.
The command can be executed using the editor.execute()
method:
// Select the entire content of the editor.
editor.execute( 'selectAll' );
We recommend using the official CKEditor 5 inspector for development and debugging. It will give you tons of useful information about the state of the editor such as internal data structures, selection, commands, and many more.
# Contribute
The source code of the feature is available on GitHub in https://github.com/ckeditor/ckeditor5-select-all.