This guide outlines the main steps 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 are provided for the Server version of WProofreader.
Step 1. 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.
Step 2. 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>
Step 3. Initialize WProofreader in HTML Editable Elements
The next step is to initialize the WProofreader functionality for the selected elements and define the required parameters. Below you will find examples of initialization in contenteditable elements such <div> and <iframe> and editable elements such as <input> and<textarea>.
The WEBSPELLCHECKER.init () method is not designed for using with either classic rich text editors (such as CKEditor 4, Froala Editor, TinyMCE, etc.) or rich text editors that are based on the custom model (such as CKEditor 5, Quill, ProseMirror, etc.).
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'
3.1. Contenteditable DIV Element
3.2. Contenteditable IFRAME Element
3.3. INPUT Element
3.4. TEXTAREA Element
Step 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.
Check a demo page with WProofreader for Editable Controls on our website.