Page History
This guide outlines the main steps that you need to follow in order to integrate and configure a new WebSpellChecker Proofreader for Editable Controls with HTML contenteditable elements such as div, textarea, iframe, to initialize WProofreader in HTML editable elements such as <input> and <textarea>, and HTML contenteditable elements such as <div>, <iframe> and etc. All the steps described steps are provided for the Cloud version of WebSpellChecker ProofreaderWProofreader.
| Excerpt Include | ||||||
|---|---|---|---|---|---|---|
|
1
...
. Obtain activation key
| Excerpt Include | ||||||
|---|---|---|---|---|---|---|
|
2. Add WProofreader script
Excerpt Include IN:_include_cloud_webspellchecker_proofreader_src_url IN:_include_cloud_webspellchecker_proofreader_src_url nopanel true
...
3. Initialize
...
WProofreader
The next step is to initialize the WebSpellChecker Proofreader WProofreader functionality for chosen the selected elements and define the required parameters. Below you will find examples of WebSpellChecker Proofreader initialization in div, iframe, input and textarea elements.
...
of initialization in contenteditable elements such <div> and <iframe> and editable elements such as <input> and<textarea>.
The required parameter for the
...
Cloud WProofreader service activation
...
is serviceId. You must pass your service ID value received on the subscription to access
...
the WProofreader services.
| Code Block | ||||
|---|---|---|---|---|
| ||||
serviceId: 'your-service-ID' |
- 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.
...
3.1. Contenteditable DIV
...
| icon | false |
|---|
...
element
...
Excerpt Include IN:_include_cloud_webspellchecker_proofreader_div IN:_include_cloud_webspellchecker_proofreader_div nopanel true
...
3.2. Contenteditable IFRAME
...
| icon | false |
|---|
...
element
...
Excerpt Include IN:_include_cloud_webspellchecker_proofreader_iframe IN:_include_cloud_webspellchecker_proofreader_iframe nopanel true
...
3.3.
...
INPUT
...
| icon | false |
|---|
...
element
...
Excerpt Include IN:_include_cloud_webspellchecker_proofreader_input IN:_include_cloud_webspellchecker_proofreader_input nopanel true
...
3.4.
...
| icon | false |
|---|
...
TEXTAREA element
Excerpt Include IN:_include_cloud_webspellchecker_proofreader_textarea IN:_include_cloud_webspellchecker_proofreader_textarea nopanel true
4. 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 |
|---|
Check a demo page with WebSpellChecker Proofreader for Editable Controls on the WProofreader initialization in <div> element on our website. |
...
