Proofreading, Spelling and Grammar Checking

CKEditor 4 can be configured to use either native spell checking capabilities provided by the browser or to use an external spell checking web service.

# Native Browser Spell Checker

By default, native browser spell check functionality is disabled in the editor. Use the config.disableNativeSpellChecker configuration option to enable it:

config.disableNativeSpellChecker = false;

After reloading the editor you should be able to see the spelling corrections underlined in your editor content.

Note: If the Context Menu plugin is enabled, it is necessary to hold the Ctrl key when right-clicking misspelled words to see their suggestions.

Note: The spell check functionality is not available natively for all browsers.

# Spell Check As You Type (SCAYT)

The SpellCheckAsYouType (SCAYT) plugin provides inline spelling and grammar checking, much like the native browser spell checker, well-integrated with the CKEditor context menu.

It is provided by WebSpellChecker. It uses the WebSpellChecker web services, transferring the text to their servers and performing spelling and grammar checking. This is a cross-browser solution.

# Spell Checking in a Dialog Window

The WebSpellChecker Dialog plugin is another spell checker solution provided by WebSpellChecker. It runs the check through a dialog window instead of marking misspelled words inline. Additionally, for some languages a Grammar Checker and Thesaurus feature is also available.

# Distraction-free Proofreading

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 UI. Spelling and grammar suggestions are available on hover with no clicking needed.

The distraction-free badge gives you access to proofreader suggestions, settings and proofreading overview in a dialog.

If you want to see an overview of all spelling and grammar mistakes, click the “Proofread in dialog” icon in the badge.

In order to use the proofreader, you need to add a few lines of configuration to your editor:

window.WEBSPELLCHECKER_CONFIG = {
    autoSearch: true,
    enableGrammar: true,
    serviceId: 'your-service-ID'
};

And load the following script on your site:

<script type="text/javascript" src="https://svc.webspellchecker.net/spellcheck31/wscbundle/wscbundle.js"></script>

WProofreader is a commercial solution, so you need to purchase a license and then add your serviceId to the configuration. You can also request a free trial ID.

Additionally, this feature is bundled with the SCAYT and WebSpellChecker Dialog plugins, so you can use it as long as you have WSC or SCAYT installed.

For more detailed documentation, refer to the official WProofreader “Getting Started” guide.

# Supported Languages

By default the WebSpellChecker solutions support 17 languages for spell checking: American English, British English, Brazilian Portuguese, Canadian English, Canadian French, Danish, Dutch, Finnish, French, German, Greek, Italian, Norwegian Bokmal, Portuguese, Spanish, Swedish and Ukrainian. Grammar checking is available for 15 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.

# Customization Options

The SCAYT and WebSpellChecker plugins include numerous configuration options that let you customize the default spell checking language, the number of SCAYT suggestions available or the content of the spell checker context menu and dialog window.

You can find them on the CKEDITOR.config API page, starting from scayt_ and wsc_.

# Spell Checking Demo

See the working “Proofreading, Spelling and Grammar Checking” sample that showcases all three official spell and grammar checking solutions.