W Wix

How to enable Dev Mode with Velo on Wix

intermediate 8 min read Updated 2026-03-18
Quick Answer

Enable Dev Mode with Velo on Wix by accessing the Wix Editor, clicking the Dev Mode button in the top menu, and turning on Velo development features. This allows you to add custom code, APIs, and databases to your Wix site.

Prerequisites

  • Active Wix website
  • Wix Premium plan or higher
  • Basic understanding of web development
  • Wix Editor access

Step-by-Step Instructions

1

Access Your Wix Site Editor

Log into your Wix Dashboard and navigate to your website. Click the Edit Site button to open the Wix Editor. Make sure you're using the current Wix Editor and not the classic version.
Ensure you have a Premium plan as Velo requires a paid subscription
2

Locate the Dev Mode Button

In the Wix Editor top toolbar, look for the Dev Mode button () icon located between the Preview and Tools buttons. If you don't see it, check that your site is on a Premium plan.
The Dev Mode icon looks like angle brackets: </>
3

Enable Dev Mode

Click the Dev Mode button. A popup will appear asking if you want to Turn on Dev Mode. Read the information about Velo capabilities and click Turn On Dev Mode to proceed.
This action cannot be easily undone, so make sure you're ready to work with code
4

Choose Your Development Environment

Select your preferred coding environment: Wix IDE (browser-based) or Local IDE (using your own code editor). For beginners, choose Wix IDE and click Start Coding.
You can switch between environments later in the Dev Mode settings
5

Explore the Velo Sidebar

Once enabled, the Velo Sidebar will appear on the left side of the editor. Here you'll find Code Files, Database, Package Manager, and Site Structure sections.
Use the Code Files section to manage your JavaScript files and page code
6

Add Your First Code File

In the Velo Sidebar, click Code Files then click the + button. Select Public & BackendBackend to create a .js file. Name your file and click Create.
Backend files run on Wix servers and can handle sensitive operations
7

Test Your Setup

Add a simple function to your new file:
export function hello() {
  return "Hello from Velo!";
}
Save the file using Ctrl+S (or Cmd+S on Mac), then click Preview to test your site.
Always save your code files before previewing to see changes
8

Publish Your Changes

Once you're satisfied with your code setup, click the Publish button in the top-right corner of the editor. Your site will now be live with Velo Dev Mode enabled and your custom code active.
Publishing with Dev Mode may take slightly longer due to code compilation

Common Issues & Troubleshooting

Dev Mode button not visible in editor

Ensure you have a Wix Premium plan or higher. Free plans don't support Velo development. Upgrade your plan in the DashboardSubscriptions.

Code files not saving or showing errors

Check your JavaScript syntax for errors. Use the Console in the Wix IDE to debug issues. Ensure you're using supported Velo APIs and not browser-specific code in backend files.

Site loading slowly after enabling Dev Mode

Optimize your code by removing unnecessary imports and functions. Use async/await for database operations and avoid heavy computations in frontend code.

Cannot access database or APIs

Verify your site is published with Dev Mode active. Check that you're importing the correct Velo modules using import statements. Review the Permissions in your database collections.

Prices mentioned in this guide are pulled from current plan data and may change. Always verify on the official Wix website before purchasing.