Skip to main content

Developing plugins

To develop a plugin, create a folder on your machine and place the index.html and config.json files there. Then load the folder into the editors as described below.

Web editors​

  1. Serve the plugin folder with CORS enabled. The editor fetches config.json and the other plugin files from a different origin, so the server must send CORS headers. For example, run the following command in the plugin folder:

    npx http-server -p 8080 --cors

  2. Open any document in an ONLYOFFICE web editor. In the browser DevTools, go to the Console tab, select frameEditor from the drop-down list, and run:

    Asc.editor.installDeveloperPlugin("http://localhost:8080/config.json");

    Developer console

The command returns true and the plugin appears in the Plugins tab. If it returns false, config.json could not be fetched or parsed. The command does not report the reason. Check the URL, then see Plugin files blocked by CORS.

If you control the editor configuration of your integration, you can load the plugin on every document open instead: add the URL of its config.json to editorConfig.plugins.pluginsData. See Adding plugins through the config.json file.

The plugin files are loaded relative to the folder that contains config.json. The plugin stays installed after the page is reloaded, in the same browser and for the same editor address. After you change the plugin files, reload the page to load the new version.

Desktop editors​

  1. Pack all the plugin files into a zip archive and change its extension to .plugin. All the plugin files and subfolders must be at the archive root.

  2. Install the plugin through the Plugin Manager. The plugin is copied to the sdkjs-plugins directory, into a folder named after the plugin guid without the asc. prefix, for example {91EAC419-EF8B-440C-A960-B451C7DF3A37}:

    %LOCALAPPDATA%\ONLYOFFICE\DesktopEditors\data\sdkjs-plugins\

    Sdkjs-plugins folder

  3. To avoid repacking the plugin after every change, replace this folder with a symbolic link to your development folder. Close the desktop editors, delete the installed plugin folder, and create the link:

    Run as Administrator:

    mklink /D "%LOCALAPPDATA%\ONLYOFFICE\DesktopEditors\data\sdkjs-plugins\{YOUR-GUID}" "C:\path\to\your\plugin"

After you change the plugin files, reopen the document to load the new version.

Next steps​

To pause and inspect the plugin code, see Debugging plugins.