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.

  1. Go to WebSpellChecker.com website and Subscribe to the Cloud WebSpellChecker services.
  2. On the subscription, you will receive an activation key that you need to specify in the WebSpellChecker configuration.
  3. Pass serviceId as 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.


GitHub Repo: https://github.com/WebSpellChecker/wproofreader Reporting issues and requesting features are in the official WProofreader repository.

Please contact WebSpellChecker to get started: https://www.webspellchecker.net/signup/froala-scayt-signup.html.



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>
<br/>
<div id="froala-details">
  <p>GitHub Repo: <a href="https://github.com/WebSpellChecker/wproofreader">https://github.com/WebSpellChecker/wproofreader</a> Reporting issues and requesting features are in the official WProofreader repository.</p>
  <p>Please contact WebSpellChecker to get started: <a href="https://www.webspellchecker.net/signup/froala-scayt-signup.html">https://www.webspellchecker.net/signup/froala-scayt-signup.html</a>.</p>
</div>
<br/>

JAVASCRIPT

<!-- Include the wscbundle.js file. -->
<script type="text/javascript" src="https://svc.webspellchecker.net/spellcheck31/wscbundle/wscbundle.js"></script>

<!-- Include the WEBSPELLCHECKER_CONFIG variable. -->
<script>
  window.WEBSPELLCHECKER_CONFIG = {
    autoSearch: true,
    autoDestroy: true,
    serviceId: "1:long-identifier-received-from-webspellchecker-after-subscription"
  };
</script>

<script>
  new FroalaEditor('#froala-editor', {
    events: {
      'initialized': function() {
          WEBSPELLCHECKER.init({
              container: this.el
          });
        }
      }
  });
</script>