{@snippet build-classic-source}
The spell checker for CKEditor 5 is a commercial solution provided by our partner, [WebSpellChecker](https://webspellchecker.com/). You can report any issues in its [GitHub repository](https://github.com/WebSpellChecker/wproofreader). The license can be purchased [here](https://ckeditor.com/contact/).
WProofreader is an innovative proofreading tool that combines the functionality of "spell check as you type" and "spell check in a dialog" in a modern, distraction-free UI. Spelling and grammar suggestions are available on hover with no clicking needed.
Click in the editor below to enable the spelling and grammar checking. Hover an underlined word to display the proofreader suggestions for any of the spelling and grammar mistakes found.
The proofreader badge in the bottom right-hand corner shows you the number of mistakes detected. It also gives you access to proofreader settings. If you want to see an overview of all spelling and grammar mistakes, click the "Proofread in dialog" button in the badge.
{@snippet features/wproofreader}
By default the spell checker supports 16 languages: American English, British English, Brazilian Portuguese, Canadian English, Canadian French, Danish, Dutch, Finnish, French, German, Greek, Italian, Norwegian Bokmal, Portuguese, Spanish and Swedish. Grammar checking is available for 14 of them — there is no grammar checking for Finnish and Norwegian.
There are also over 150 additional languages and specialized dictionaries such as medical and legal available for an additional fee. You can check the full list here.
WProofreader is installed separately from CKEditor 5 and does not need to be combined into an editor build as other features. To use this tool, it is necessary to load the WProofreader script on your page and provide the configuration.
The proofreader can be used either as a cloud solution or hosted on your own server.
The "Proofread in dialog" feature requires access to the editor instance to edit content. To grant access for WProofreader, it is necessary to link the editor's instance with the editable element. You can add the following configuration to the editor to use "Proofread in dialog":
ClassicEditor.create(
document.querySelector( '#editor' )
).then( ( editor ) => {
editor.ui.getEditableElement( 'main' ).editor = editor;
} );
After signing up for a trial or paid version, you will receive your service ID which is used to activate the service.
Add the following configuration to your page:
<script>
window.WEBSPELLCHECKER_CONFIG = {
autoSearch: true,
enableGrammar: true,
serviceId: 'your-service-ID'
};
</script>
And then load the proofreader script:
<script type="text/javascript" src="https://svc.webspellchecker.net/spellcheck31/wscbundle/wscbundle.js"></script>
Refer to the official documentation for more details about the cloud setup and available configuration options.
After signing up for a 30-day trial version, you will receive access to the WebSpellChecker Server package to install on your own server.
You will need to specify the path to the service on your page:
<script type="text/javascript" src="http(s)://your_host_name/spellcheck/wscbundle/wscbundle.js"></script>
Then add the following configuration to your page:
<script>
window.WEBSPELLCHECKER_CONFIG = {
autoSearch: true,
enableGrammar: true,
servicePort: '2880',
servicePath: '/'
};
</script>
Refer to the official documentation for more details about the server setup and available configuration options.
WProofreader configuration is set outside the CKEditor 5 configuration. Refer to the WProofreader API for further information.
You can report issues and request features in the official WProofreader repository.