Skip to main content

Navigating the Theme Editor

The Theme Editor is where you customize the look and feel of your store — adding sections, adjusting settings, and previewing changes in real time.

Opening the Theme Editor

  1. In your Shopify admin, go to Online StoreThemes.
  2. Find the theme you want to edit and click Customize.

For a detailed walkthrough, see Shopify's official guide: Shopify Theme Editor.

Editor Layout

The Theme Editor is divided into three main areas:

  • Left panel — Lists all sections on the current page. Click a section to expand its settings and blocks.
  • Preview area — Shows a live preview of your store. Changes appear here as you make them.
  • Top bar — Use the page selector dropdown to switch between different page templates (Homepage, Product page, Collection page, etc.).

Working with Sections and Blocks

Sections are the building blocks of each page — for example, a slideshow, a featured collection, or an image banner.

Blocks are smaller elements inside a section — for example, a heading, a button, or a text field within an image banner.

  • Add a section — Click Add section at the bottom of the left panel and choose from the available options.
  • Reorder sections — Drag and drop sections in the left panel to change their order on the page.
  • Remove a section — Click the section, scroll to the bottom of its settings, and click Remove section.
  • Add a block — Click a section to expand it, then click Add block.

For a full reference of all available sections, see our Sections documentation.

Switching Between Pages

Use the dropdown at the top center of the editor to switch between page templates:

  • Homepage
  • Product pages
  • Collection pages
  • Blog / Article pages
  • Cart, Checkout, and more

Each page template has its own set of sections that you can customize independently.

Mobile and Desktop Preview

Use the device icons in the top bar to toggle between desktop and mobile preview. This helps you verify that your layout looks correct on all screen sizes.

Saving Changes

Click Save in the top-right corner to save your changes. Changes are saved to the theme but are not visible to customers until the theme is published.

For more details on the Theme Editor, see Shopify's help center: