UX Guidelines for Editor Add-Ons

When designing your add-on panel's UI, ensure it is intuitive and user-friendly. Consider using the Wix Design System to maintain a cohesive design.

Use components such as:

  • SidePanel to create a structured layout.
  • FormField and input components to collect user input effectively.

These tools help you design a panel that aligns with the overall Wix editor experience.

Panel dimensions

When setting up your add-on extension, you'll need to define its dimensions. Choose the appropriate dimensions for your panel based on your add-on’s content and use case.

Here are the recommended width options for your panel:

  • Small: 288 px wide (recommended). This matches the size of most native editor panels.
  • Medium: 404 px wide. Ideal for panels with additional features, such as tabs.
  • Large: 660 px wide. Best for larger content, like thumbnails.

The height of the panel can be set between 200 and 500 px, depending on your needs.

ux-guidelines

Did this help?