Fehrist
Themes & the editorMenu

Themes & the editor

Installing a theme from the marketplace, and building pages with sections and blocks.

What a theme is

A theme controls your storefront's look — layout, colors, fonts, and which building blocks ("sections") are available on each page. Every store starts with a default theme already installed and live, so you can start selling before ever opening the editor.

Installing a theme

The Theme Store includes a growing set of premium presets at no extra cost, covering general retail, luxury, large catalogs, fashion campaigns, beauty, home, food, electronics, wellness, and editorial stores. See every current theme, with previews, on the themes page.

  1. Open Themes in the sidebar, then Browse marketplace.
  2. Preview any theme before installing — installing adds it to your theme library without replacing what's currently live.
  3. Once installed, click Publish on the theme you want live. Your previous theme stays in your library, so switching back later doesn't lose anything.

Safe to experiment

Installing a theme creates a separate editable copy. It never changes the live store until you publish. You can install the same preset more than once to explore different designs without overwriting earlier work.

Finding the right starting point

  • Use Aster for a fast, flexible default or Noor for a luxury editorial storefront.
  • Choose Bazaar or Circuit when shoppers need to scan a large number of products quickly.
  • Choose Pulse, Radiant, or Saffron for a strong industry-specific visual direction.
  • Choose Habitat, Juniper, or Canvas when brand storytelling and imagery should lead the experience.

The theme editor

Open the editor from a theme's Customize button. It's a live, click-to-select canvas — click anything on the preview to jump straight to its settings in the sidebar, instead of hunting through a layers panel. The sidebar itself is resizable, so you can give it more room while working on a page with lots of sections.

Sections and blocks

  • A page (home page, product page, collection page, etc.) is built from a stack of sections — a hero banner, a featured-products grid, a newsletter signup, and so on.
  • Click Add section at the point in the page you want it, and choose from the sections your theme (and any installed apps) make available.
  • Drag a section's handle to reorder it, or remove it with the trash icon — nothing is permanent until you publish.
  • Add a Flexible layout section to combine headings, text, images, buttons, spacers and dividers in a grid, horizontal row or vertical stack. Reorder or hide each block independently.
  • Every section has its own settings panel (text, images, colors, links) generated from that section's schema — no code required to customize it.

Responsive design controls

Select a section and switch from Content to Design. You can set spacing, maximum width, colors, corner radius and visibility independently for desktop, tablet and mobile. Smaller devices inherit the larger-device design until you override a value, so you only customize what actually needs to change.

The preview uses real 1440 × 900, 768 × 1024 and 390 × 844 viewports. Choose Fit, 50%, 75% or 100% zoom without changing the storefront's responsive breakpoint. Use Select mode to edit sections and blocks, then Interact mode to test real menus, forms and links.

Reusable sections

Open a section and choose Save as reusable to keep its content, blocks and responsive design together. Your saved composition appears at the top of Add section and can be inserted into any template without sharing ids or overwriting the original.

Design quality audit

The Audit tab checks mobile readiness, text contrast, conversion essentials, page length and motion use. It runs locally from your theme data, so it needs no AI API key, sends no content to a third party and has no usage cost. Select a finding to jump to the affected section.

App blocks

If you've installed an app that adds storefront UI (a reviews widget, an upsell carousel, a countdown timer), it shows up as its own section type in Add section — dragging it in embeds that app's UI directly into the page, positioned exactly where you put it.

Saving and publishing

Changes autosave to a private draft as you work. Save draft saves without changing the customer storefront. When you're ready, click Publish to take a version snapshot and make that draft live. Theme history keeps every published version, so you can always roll back if a change doesn't work out.

Building your own theme?

See Build apps & themes for the file structure (layouts, templates, sections, snippets, assets) and how to submit a theme to the marketplace.