WProofreader plugin for CKEditor 5 inherits all the functionality of the WProofreader component with slight adaptation to the view and features of the editor. Right now the plugin is just a “wrapper” for the classic WProofreader. Thus, WProofreader will be more native to CKEditor 5 build procedure. The main differences between the plugin and the classic WProofreader are: For more details, please refer to the official repo or NPM package of the WProofreader plugin for CKEditor 5. If your preference is to use the plugin instead of the classic WProofreader initialization, please follow the steps below. 1. Clone CKEditor 5 Classic editor: 2. Go to the editor folder: 3. Install all the required dependencies: 4. Install the WProofreader plugin: 5. Open /src/ckeditor.js file. 6. Import the WProofreader plugin: 7. Add WProofreader plugin to ClassicEditor.builtinPlugins: 8. Add the wproofreader field and its options to ClassicEditor.defaultConfig: In case of the Cloud version, serviceId and srcUrl are mandatory options. In case of the Server-based version, you need clearly define path to the WebSpellChecker/WProofreader server: The full list of configuration options for WProofreader is available in API docs. 9. Rebuild the bundle: That's it. Now you should be able to use the spelling and grammar checking functionality of WProofreader with CKEditor 5. Try it out on the default sample page: /sample/index.html.git clone -b stable [email protected]:ckeditor/ckeditor5-build-classic.git
cd ckeditor5-build-classic
npm install
npm install @webspellchecker/wproofreader-ckeditor5 --save-dev
import WProofreader from '@webspellchecker/wproofreader-ckeditor5/src/wproofreader';
ClassicEditor.builtinPlugins = [
...,
WProofreader
];
ClassicEditor.defaultConfig = {
...,
wproofreader: {
serviceId: 'your-service-ID',
srcUrl: 'https://svc.webspellchecker.net/spellcheck31/wscbundle/wscbundle.js'
}
}
ClassicEditor.defaultConfig = {
...,
wproofreader: {
serviceProtocol: 'https',
serviceHost: 'your-host-name',
servicePort: '2880',
servicePath: '/',
srcUrl: 'https://your-host-name/virtual-directory/wscbundle/wscbundle.js'
}
}
npm run build