This guide outlines the main steps that you need to follow in order to integrate and configure WProofreader for Editable Controls with HTML contenteditable elements such as div, textarea, iframe, etc. All the described steps are provided for the Cloud version of WProofreader.
0. Obtain Service ID
Sign up for the trial version to get started with WProofreader Cloud. Once you have subscribed, you will receive an email with your service ID, an activation key, required for the WProofreader service activation. If you already have one, you can skip this step.
1. Add WProofreader Script
Add the wscbundle.js script on your web page.<script type="text/javascript" src="https://svc.webspellchecker.net/spellcheck31/wscbundle/wscbundle.js"></script>
2. Initialize WProofreader in HTML Editable Elements
The next step is to initialize the WProofreader functionality for chosen elements and define the required parameters. Below you will find examples of WProofreader initialization in div, iframe, input and textarea elements.
- Specify your encrypted service ID. 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.
serviceId: 'your-service-ID'
- Adjust the default WProofreader parameters. Check a full list of WProofreader API parameters and their possible values to adjust default WProofreader settings and configure WProofreader to fit your needs.
2.1. Contenteditable DIV Element
2.2. Contenteditable IFRAME Element
2.3. Contenteditable INPUT Element
2.4. Contenteditable TEXTAREA Element
Check a demo page with WProofreader for Editable Controls on our website.