Contribute to this guideReport an issue

guideProofreading, Spelling and Grammar Checking

The out-of-the-box spelling and grammar checking functionality is provided through plugins that are included in the Standard and Full presets available from the official CKEditor 4 Download site. You can also add them to your custom build with online builder.

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 4 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 Check As You Type in CKEditor 4 WYSIWYG editor

# Distraction-free Proofreading

This is a commercial solution provided by our partner, WebSpellChecker. You can report any issues in its GitHub repository.

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, punctuation and grammar suggestions are available on hover with no clicking needed or as a convenient dialog, both with additional in-place replacement suggestions.

Spelling and grammar checking with WProofreader in CKEditor 4 WYSIWYG editor

The proofreader badge in the bottom-right corner shows you the total number of mistakes detected. Hover an underlined word to display the proofreader suggestions for any of the spelling and grammar mistakes found. This hovercard allows the user to employ the feature on the go.

Distraction-free proofreader badge in CKEditor 4 WYSIWYG editor

If you want to see an overview of all spelling and grammar mistakes, click the “Proofread in dialog” icon in the badge. It will invoke a detached floating panel, easy to navigate and perfect for dedicated proofreading sessions. Turning it on brings a dialog similar to the on-hover one, but substantially larger. It is a detached, floating window that can be conveniently moved around as needed, which is especially important on small screens. However, it also supports accessibility, as moving it left may be more convenient for left-handed persons or more comfortable in the case of right-to-left languages.

Proofreading dialog in CKEditor 4 WYSIWYG editor

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 plugin, so you can use it as long as you have SCAYT installed.

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

# Supported Languages

# Language support

The most popular languages offered by WebSpellChecker solutions include: American English, British English, Canadian English, Canadian French, French, German, Italian, Greek, Spanish, Finnish, Danish, Dutch, Portuguese, Swedish, Ukrainian, Norwegian Bokmål, Brazilian Portuguese. There are, however, over 160 languages altogether, available for download from the WebSpellChecker site. Grammar checking is available for over 20 languages.

A recent addition to the software are AI-driven tools. Smart algorithms employed in the AI-based language dictionaries offer a far better checking quality, generating proofreading suggestions based on the context of the sentence. They provide more suitable suggestions that address mistakes with thrice the accuracy of traditional dictionaries. The AI-based support is currently available for English and German.

Here you can check the full list of available languages.

# Custom dictionaries

Apart from the language dictionaries, WebSpellChecker offers two specialized dictionaries: a medical and a legal one, available for an additional fee.

There are also two types of custom dictionaries available.

One is the user dictionary that can be expanded and will grow during the regular use of the feature simply by adding new words to the dictionary. This is a perfect solution for editors and writers working on specific content that may contain slang or professional jargon.

The other is the so-called company-wide dictionary. These premade dictionaries can be uploaded by the system administrators or CKEditor 5 integrators and can be made available company-wide, accessible for all users. This way all benefits of a user-generated dictionary can be shared among the team, making the proofreading process more structured and controlled.

# Multi-language Support

If you have content in multiple languages, the spell check feature can automatically detect the text language properly. It is enough to choose “Auto Detect” in the Language dropdown of the spell checker settings. Suggestions for spelling and grammar (where available) will be displayed properly for each text fragment.

Choose the auto-detect language option.

# Customization Options

The SCAYT plugin includes 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.

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

The out-of-the-box spell checking functionality of SCAYT is ad-supported. If you want to remove the ads, you can purchase a license here.

# Spell Checking Demo

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