Versions Compared

Old Version 4

changes.mady.by.user Julia Shaptala

Saved on

compared with

New Version Current

changes.mady.by.user user-232a4

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

This guide outlines the main steps that you need to follow in order to integrate and configure WebSpellChecker Proofreader with a new WProofreader with the auto-searching functionalitydetecting functionality. All  All the described steps are provided for the Cloud version of WebSpellChecker Proofreader.

Tip

Good to know:

  • WebSpellChecker Proofreader is a new standalone control based on the SpellCheckAsYouType (SCAYT) product that is used for spell and grammar checking, proofreading.
  • The new autoSearch feature brings awesome capabilities and simplifies the integration of proofreading functionality in web applications. It automatically searches and detects all the editable elements that are present on the page. As soon as an end user sets focus on this editable element or rich text editor (starts typing).
  • To get started with the trial or paid version of WebSpellChecker Proofreader, it is required to subscribe to the Cloud SCAYT services. On the subscription, you will receive an email with your encrypted service ID, an activation key, that is required for the WebSpellChecker Proofreader service activation.

Add WebSpellChecker Proofreader Script with 'autoSearch'

The next step is to initialize the WebSpellChecker Proofreader functionality for chosen elements and define the required parameters. 

  • Specify your encrypted service ID. The required parameter for the Cloud WebSpellChecker Proofreader service activation is serviceId. You must pass your service ID value received on the subscription to access the WebSpellChecker Proofreader services.
  • Adjust the default WebSpellChecker Proofreader parameters. Check a full list of WebSpellChecker Proofreader API parameters and their possible values to adjust default WebSpellChecker Proofreader settings and configure WebSpellChecker Proofreader to fit your needs.
Code Block
languagejs
themeEmacs
<script>
	window.WEBSPELLCHECKER_CONFIG = {
		autoSearch: true,
		enableGrammar: true,
       serviceId: 'encrypted-service-ID'
   };
</script>

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

Check a demo page with WebSpellChecker Proofreader for Editable Controls on our website.

New UI of WebSpellChecker Proofreader is Coming Soon

The image below depicts the main aspects of new UI and extended capabilities for WebSpellChecker Proofreader. Besides proofread as you type feature, with the new version of WebSpellChecker Proofreader, end users also will be able to perform proofreading in a separate pop-up window (dialog).

WProofreader.

Excerpt Include
IN:_include_wsc_proofreader_overview_tip
IN:_include_wsc_proofreader_overview_tip
nopaneltrue

Supported integrations

Excerpt Include
IN:_include_wsc_proofreader_autosearch_supported_integrations
IN:_include_wsc_proofreader_autosearch_supported_integrations
nopaneltrue

1. Obtain activation key

Excerpt Include
IN:_include_wsc_proofreader_cloud_subscribe_step
IN:_include_wsc_proofreader_cloud_subscribe_step
nopaneltrue

2. Initialize WProofreader

There are two approaches for initializing WProofreader in your web app: using the config variable or inline data attributes.

Option A. Initializing using config variable

1. Add config with options

Excerpt Include
IN:_include_wsc_proofreader_cloud_initialization_autosearch
IN:_include_wsc_proofreader_cloud_initialization_autosearch
nopaneltrue

2. Add WProofreader script

Excerpt Include
IN:_include_cloud_webspellchecker_proofreader_src_url
IN:_include_cloud_webspellchecker_proofreader_src_url
nopaneltrue

Option B. Initializing using inline data attributes

Excerpt Include
IN:_include_wsc_proofreader_cloud_initialization_autosearch_inline_data_attributes
IN:_include_wsc_proofreader_cloud_initialization_autosearch_inline_data_attributes
nopaneltrue

3. Adjust default options

You can adjust the default options for your needs. Here is a full list of WProofreader API options and their possible values.

Info

You can check the demos of WProofreader integrations with a various rich text editors on our website.

...