Dashboard Plugin Extension Files and Code

CLI Documentation Notice We've released a new Wix CLI. Continue here if your project uses the Wix CLI for Headless. Determine which CLI your project uses.

This feature is in Developer Preview and is subject to change.

In your project, the source code for your dashboard plugins is located in the src/extensions/ folder.

Each plugin is defined in its own subdirectory that contains the following files:

Copy

Plugin extension configuration (extension.json)

The extension.json file contains the dashboard plugin extension's configuration details. This file defines which dashboard page hosts your plugin. The structure is as follows:

Copy
FieldTypeDescription
compIdstringID of the plugin you created using the CLI. This ID is auto-generated by Wix.
compTypestringAlways BACK_OFFICE_EXTENSION_WIDGET for dashboard plugins.
compNamestringName of the plugin.
compData.backOfficeExtensionWidget.hostingPlatformstringAlways BUSINESS_MANAGER.
compData.backOfficeExtensionWidget.extendsstringSlot ID of the dashboard page hosting the plugin.
compData.backOfficeExtensionWidget.titlestringThe plugin's title.

Plugin content (plugin.tsx)

The page.tsx file contains the dashboard plugin content.

The content is defined in a React component that renders when the page is active. Below is an example of how your plugin.tsx file will look upon creation:

Copy

In the dashboard plugin component, you can:

  • Add custom code to your plugin using React.
  • Access data passed to the dashboard slot with the Wix Dashboard API.
  • Match Wix’s look and feel using the Wix Design System, which includes the same components Wix uses to build dashboards.
Did this help?