New Froala Editor v5.0.0 is here – Learn More
3rd Party Integration
WProofreader Spelling and Grammar Checker
Froala WYSIWYG HTML Editor has a built-in integration for WebSpellChecker.com which enables advanced spell checking. SpellCheckAsYouType allows the user to see and correct misspellings while typing. Misspelled words are underlined. The user just needs to right-click a marked word and select a suggestion to replace the word with.
To integrate and activate the WebSpellChecker functionality on your website there are several steps to follow.
- Go to WebSpellChecker.com website and Subscribe to the Cloud WebSpellChecker services.
- On the subscription, you will receive an activation key that you need to specify in the WebSpellChecker configuration.
- Pass
scaytCustomerIdas an option when initializing the editor. It should be a long identifier like: "1:ut12s1-7rr3J1-Fhioh12-mIewo-FJIjo12-BVUB21-uEXCy2-asdpjko1-gXuG4-NUNri4-5q9A52-Pf".
Try it yourself:
This is an exampl of a sentence with two mispelled words. Just type text with misspelling to see how it works.
HTML
<div id="froala-editor"> <p>This is an exampl of a sentence with two mispelled words. Just type text with misspelling to see how it works.</p> </div>
<div id="froala-editor"> <p>This is an exampl of a sentence with two mispelled words. Just type text with misspelling to see how it works.</p> </div>
CSS
<!-- Include WebSpellChecker plugin style. --> <link rel="stylesheet" href="../css/third_party/spell_checker.min.css">
JAVASCRIPT
<!-- Include the plugin JS file. -->
<script type="text/javascript" src="../js/third_party/spell_checker.min.js"></script>
<script>
$(function() {
$('div#froala-editor').froalaEditor({
scaytAutoload: true,
scaytCustomerId: '1:long-identifier-received-from-webspellchecker-after-subscribing-to-scayt',
pluginsEnabled: ['spellChecker'],
toolbarButtons: ['bold', 'italic', 'spellChecker', '|', 'undo', 'redo'],
toolbarButtonsMD: null,
toolbarButtonsSM: null,
toolbarButtonsXS: null
});
});
</script> 
