Skip to main content
Theme editor showing the home page being edited

Sales Channels > Online Store > Theme Editor (Home page)

This view can look different dependent on your user role.
See Visibility & Permissions for details.

​
Primary Purpose

The Theme Editor is a visual customisation tool for your storefront. It has four modes, accessible from the left sidebar: Settings, Content (page templates and sections), Theme (global design tokens), and Translations (multi-language content and system string overrides). Changes preview in real time across desktop, tablet, and mobile viewports.
Switch between page templates with the page dropdown — Home, About, Collection, Listing, Stores, Bag, Checkout, and more. Each page has its own arrangement of sections.See Pages.
Use the right-hand settings panel to change colours, typography, layout, buttons, inputs, calendars, and listing cards. Changes apply across the entire storefront.See Settings.
For anything beyond what the visual editor exposes, drop in custom CSS. See Custom CSS.
Switch to the Translations mode to manage multi-language text for your online store. The editor has three scopes, selectable from a sidebar:
  • Content — translate merchant-authored text: hero titles, descriptions, button labels, about page content, meta titles and descriptions, announcement bar text, sidebar text, footer copyright, and other storefront copy. These fields map to your default-language content and are stored as separate translations per language.
  • System strings — override the built-in UI text on your storefront (navigation labels, product page elements, cart and search text, filter labels) in any language, including your default language. Each string ships with a TWICE-maintained default; you only override what you want to customise.
  • Commerce — override shared commerce strings (product cards, availability labels, pricing display) that appear across all your sales channels.
Select a target language from the dropdown at the top, then edit translations inline in the side-by-side table. Save and cancel from the top bar, the same as other editor modes.See Multi-Language Content and Localization for background on how translations and system string overrides work.
Preview changes in any viewport before saving. Save writes your changes directly to the live storefront — there is no separate draft or publish step. If you close the editor with unsaved changes, a dialog asks whether to save or discard them.

​
Blocks on most pages

Most page templates share the same set of storewide blocks. Configure them once and they apply everywhere they appear:
  • Announcement bar — a slim message bar at the top (content and visibility here; colours in the Announcement bar settings).
  • Header — logo, navigation items (links to internal pages or external URLs), logo and menu position, sticky behaviour, and the cart icon style.
  • Footer — toggle the menu links, email signup, description, payment icons, policy links, and copyright text.
  • Page settings — per page, set its visibility and SEO meta title and description. The URL handle is shown read-only — page paths are fixed; edit your domain under Settings > Domains.
Not every template carries every block: the Checkout and Store selection sidebar templates expose only Page settings (no announcement bar or header blocks), the Custom scripts template has no header blocks at all, and the footer editor is unavailable on the Checkout and Custom scripts templates.

​
Page Selector

Page dropdown showing all editable storefront pages

Page dropdown

The page dropdown lets you switch between every storefront page template.

​
Settings Panel

Settings panel in the theme editor

Settings panel

The settings panel on the right exposes per-section and per-element configuration for whatever you’ve selected.

​
Visibility and Permissions

Access to this view is controlled by your .