Przejdź do treści

Guide · Building a website · 5 min read

Getting around the Wix Studio Two Editor: a guided tour

The Wix Studio Two Editor has five areas to learn: the top bar for pages, breakpoints, preview and publish; the left rail for adding and organising; a canvas you can pan and zoom; the action bar for quick edits; and the Inspector for everything precise. Learn those and you can find almost anything.

Wix Studiowix studio twoeditor tourinspectorlayersBy Matt · Updated 5 November 2026

Key points

  • The top bar holds pages, breakpoints, zoom, preview and publish.
  • Select anything to get the action bar; open the Inspector for precise work.
  • Zoom runs from 10% to 600% and never changes the breakpoint.
  • Hiding an element on mobile turns Auto Mobile off for its section.

The Wix Studio Two Editor looks different from the Studio Editor as soon as it opens. It's dark, the canvas moves, and most controls only appear when you select something. Once you know where five things live, the top bar, the left rail, the canvas, the action bar and the Inspector, you can find almost anything. This is our tour, based on Wix's Studio Two Help Center articles and its orientation page for the new editor.

What's in the top bar?

The top bar runs left to right:

  • Left: the Studio Two menu, which opens the dashboard, editor tools and canvas view options. Next to it are the Design and Code toggle and the site name, which opens Site Overview.
  • Centre: the page you're on, the breakpoints, and Customize Breakpoints, which opens Responsive Settings for breakpoints, Auto Mobile and limit scaling. Zoom sits here too.
  • Right: Undo and Redo, Preview and Publish.

The Studio Two menu also holds the Site menu, with Save, Site History and Export/Import. Saving happens automatically, so you'll mostly use it for Site History.

What's on the left rail?

The left rail is where you add and organise things:

  • Add Elements. Hover over it to choose Elements, Sections or Pages. Sections and pages can be generated with AI.
  • Draw Element. Click and drag on the canvas to draw text, containers, images, buttons, shapes or videos at the size you want.
  • Site Styles. Colours, fonts, text styles and styled buttons, lines and containers.
  • Site Structure. Pages, Layers and Global sections in one panel.
  • CMS, which opens your collections, and My Business, for your Wix apps.
  • Help & Tutorials, and Aria, Wix's AI assistant, at the bottom left.

How do you move around the canvas?

The Studio Two canvas moves. Wix's orientation page says you can click and drag anywhere on the canvas to pan around the workspace, which helps when you're zoomed in or have panels open.

Zoom runs from 10% to 600%. Zoom in for fine work and out for an overview. Zooming only changes your view. It never changes the breakpoint you're editing or the canvas width. To see a page at a different width, drag the page-size handles at the sides of the canvas, or type a width into the canvas width field at the top right.

We haven't found a Studio Two keyboard shortcuts article yet. The Studio Editor's shortcuts may not carry across, so don't rely on them until Wix documents them.

What does the action bar do?

Select anything and an action bar appears at the bottom of the screen, with only the controls that apply to that element. A text element, for example, gets Edit Text, Ask AI, a link icon, a text style dropdown and More Actions. Sections get section tools such as Ani-Mate.

The action bar is for quick changes. For anything deeper, open the Inspector. Some elements also show an AI Actions icon for jobs like removing an image background or rewriting text.

How does the Inspector work?

Open it from the Open Inspector icon at the top right. It shows the name of whatever you've selected and changes its options to match. It has three tabs:

  • Design: size and responsive behaviour, colours, borders, corners, shadows, typography, layout, position and custom CSS.
  • Motion: entrance, loop and scroll animations, click and hover interactions, and mouse effects.
  • Settings: data connections, accessibility, visibility conditions and event handlers.

Select several elements of the same type and the Inspector shows the settings they share, so you can change them all at once.

Where do Layers and pages live?

In Site Structure. The Pages tab is where you add, rename and set up pages, including their SEO settings and URL slugs. The Layers tab lists every section, container and element on the page in order, with children shown under their parents. Hover over an item to highlight it on the canvas, and click to select it.

Drag items in Layers to reorder them. That also changes which overlapping element sits on top, so text has to sit above a shape in the list to show over it.

Hiding an element applies to the breakpoint you're on. Hide something on mobile only and Wix turns Auto Mobile off for that element's section, so do it on purpose.

If clicks keep selecting the wrong thing, open the Studio Two menu, then View, then Layer Selection, and choose Parent Container First or Child Element First.

What's the fastest way to get comfortable?

Our advice for a first session in the new editor:

  1. Set up Site Styles before you build a single page.
  2. Build on desktop and leave Auto Mobile on.
  3. Use the action bar for quick edits and the Inspector for anything precise.
  4. Keep Layers open while you work on a busy section.
  5. Check the mobile breakpoint after every section, not at the end.

Want help with a Studio Two build? See our Wix Studio 2 service, or read our guide to what changes from the Studio Editor. For layout across screens, read responsive design in Wix Studio Two.

Questions people ask

Why is the Wix Studio Two Editor dark?

It's one of the ways Wix tells its editors apart. Studio Two is dark, and the Studio Editor is light.

Where did the toolbar go?

It's now the action bar at the bottom of the screen, and it only appears when something is selected.

Does zooming change the breakpoint?

No. Zoom only changes your view. Switch breakpoint or set the canvas width to check another screen size.

Are there keyboard shortcuts in Studio Two?

Wix hasn't published a Studio Two shortcuts list that we've found, as of November 2026. We'll add them to this guide when it does.

Sources

  1. Get to know the editor (Wix Studio Two orientation page) (Wix)
  2. Studio Two Editor: A Guided Tour of the Studio Two Editor (Wix)
  3. Studio Two Editor: Working With the Inspector Panel (Wix)
  4. Studio Two Editor: Working with Layers (Wix)
  5. Studio Two Editor: The Difference between the Studio Editor and the Studio Two Editor (Wix)
  6. Studio Two Editor: Working with Breakpoints (Wix)
  7. Studio Two Editor: Adding and Customizing Text (Wix)

Need help with wix studio 2?

Umów bezpłatną rozmowę