Skip to main content

Storefront design

  1. Storefront design

    Customize your store's look, content and branding with a live preview. The Open store link shows your live storefront in a new tab. This tour walks you through every tool of the editor.

  2. Desktop or mobile

    Switch the preview between a desktop width and a phone frame. Choosing the phone also opens the Mobile tab, where you pick the mobile bottom bar style.

  3. Reload the preview

    Reloads the preview page. Your unsaved changes are sent to it again, so nothing is lost.

  4. Undo last save

    After you confirm, colours, font, corner radius, design and layout return to how they were before the last save. Sections and content are not affected, and running it again redoes the change.

  5. Undo

    Steps back through your unsaved edits, up to 40 steps. Ctrl+Z or Cmd+Z does the same when you are not typing in a field.

  6. Save

    Publishes everything you changed in all tabs at once. Until you save, your edits exist only in this editor and its preview.

  7. Hide the tools panel

    Hides the settings panel and icon rail for a full-width preview. Press it again to bring them back.

  8. Live preview

    Your real storefront with the unsaved design. Click a text to edit it in place, or hover a section for tools to move, hide, style or delete it, open its settings, or add a new section between others.

  9. Tools panel

    Shows the controls of the tab you pick on the icon rail on the right. When you select a section in the preview, a Section settings button is added to the rail for that section.

  10. Design tab

    The look of your store: ready-made site themes, Look Kit, layout themes, page structure mode and templates, preset themes, colours, fonts, corners and buttons, the light and dark colour system, and design sets. Applying a site theme or a design set takes effect at once.

  11. Content tab

    Replace the theme's ready-made texts with your own, such as the hero, call to action, trust strip and feature cards; empty fields fall back to the theme default. The section list on the left selects a section, hides it with the eye and reorders your service groups.

  12. Header & Footer

    Style the header (layout, logo position, menu style, sticky header, header button and your own menu links, dropdowns or mega panels), the footer (style, columns, social links and copyright text) and the announcement bar.

  13. Assistant

    Set up the help assistant on your storefront: switch it on, set its title, greeting and colour, add quick links and a product tour video, and show your departments and team. The AI assistant itself is configured on its own page.

  14. Mobile

    Pick one of 15 styles for the mobile bottom bar and check it in the phone preview. A link underneath leads to the full mobile menu settings.

  15. Brand / PWA

    Your store name and description, whether the store is published, light and dark logos and favicons, the add-to-home-screen (PWA) app settings, the customer panel theme and, on eligible plans, hiding the platform credit.