The multilingual spelling and grammar checking solution for Tiptap editor version 3. It provides both instant and in-dialog proofreading modes in a convenient UI.
WProofreader extension for Tiptap inherits all functionality of the WProofreader component with slight adaptation to the view and features of the editor. For more details, visit the WProofreader repo or official web page.
- Before you start
- Install instructions
- Commands
- Documentation
- Reporting issues
- Technical support or questions
- License
The Tiptap extension is a frontend component that connects to the WProofreader service, so an active WProofreader SDK subscription is required to use it. New users can sign up for the SDK, where a free plan with basic spelling and grammar check and a daily usage limit is available. After signing up, your service ID will be on the Credentials page.
Existing clients of the cloud version use the same service ID from the Credentials page, while clients of the self-hosted version point the extension to their service endpoint (see the server-based configuration example below).
-
Install the extension.
To install the extension, run the following command:
npm install @webspellchecker/wproofreader-tiptapImport the WProofreader extension into the project. Then, add it to the
extensionsarray and configure.import { Editor } from '@tiptap/core'; import StarterKit from '@tiptap/starter-kit'; import WProofreader from '@webspellchecker/wproofreader-tiptap'; ... new Editor({ element: document.querySelector('.editorElement'), extensions: [ StarterKit, WProofreader.configure({ wproofreader: { /* config of WProofreader */ } }) ], content: '<p>Hello World!</p>' })
-
Configure the extension.
After installing the extension, you need to configure it in the Tiptap setup. The configuration is added to the
wproofreaderfield. For a detailed list of available customization options, refer to the Configuration reference.For the Cloud-based version of WProofreader:
wproofreader: { serviceId: 'your-service-ID' // required for the Cloud version only }
serviceIdis a mandatory parameter for activating and using the extension pointed to the Cloud-based version of WProofreader. You can find your service ID on the Credentials page, or sign up to receive one.For the Server-based version of WProofreader:
wproofreader: { serviceProtocol: 'https', serviceHost: 'localhost', servicePort: '443', servicePath: 'virtual_directory/api', // by default the virtual_directory is wscservice srcUrl: 'https://host_name/virtual_directory/wscbundle/wscbundle.js' }
Unlike the Cloud-based version, the
serviceIdparameter is not used here. Instead, it is required to specify the path to the backend entry point hosted on the client’s infrastructure.
enableWProofreader- Enables the WProofreader functionality.disableWProofreader- Disables the WProofreader functionality.toggleWProofreader- Toggles the WProofreader functionality.openWProofreaderSettings- Opens the WProofreader settings.openWProofreaderDialog- Opens the WProofreader dialog.
To find out more, refer to the following documentation:
We use GitHub Issues as the official public bug tracker for WProofreader extension for Tiptap. Here are some recommendations to take into account when reporting an issue:
- Provide steps which help us to reproduce an issue. A sample page or JSFiddle is always welcomed.
- Some issues may be browser and integration-specific. So, please specify what browser and integration you encountered the issue with.
Holders of an active subscription to the services or a commercial license have access to professional technical assistance directly from the support team. Contact us here.
Licensed under the terms of the MIT license. For full details about the license, please check the LICENSE.md file.