Theme editor basics

The theme editor is where you build and arrange every page in Reign. You add sections, fill them with blocks, set their options in the sidebar, and watch the result in the preview beside it. This article covers the editor mechanics. For how sections, blocks, and groups fit together, see Sections, blocks, and groups. For the settings that repeat across sections, see Common section settings.

Open the editor

1. In your Shopify admin, go to Online Store > Themes.
2. Find Reign in your theme list.
3. Click Customize.

The editor opens with the sidebar on the left, the live preview in the middle, and the top bar across the top.

Move around the editor

The sidebar lists the sections on the current page, with each section's blocks nested under it. This is the block list. Click a section or a block to select it and open its settings on the right.

The top bar switches what you are editing:

• The page picker (the dropdown in the center of the top bar) changes which page you preview and edit. Switch between the home page, a product page, a collection page, and the rest.
• The device toggle previews desktop or mobile.
• Save stores your changes. The editor does not save on its own, so save before you leave.

Add a section

1. In the sidebar, click Add section.
2. Pick a section from the list. Reign groups them under headings such as Banners, Storytelling, and Layout.
3. The section is added to the page and selected, so its settings open on the right.

A new section lands at the bottom of the page. Drag it up the block list to move it.

Reorder, hide, and remove a section

• Reorder: in the block list, drag a section by its handle to a new position. The preview updates as you drop it.
• Hide: click the eye icon next to a section to hide it from your live store without deleting it. Click it again to show it. A hidden section stays in the block list, dimmed.
• Remove: select the section, then click Remove section. This deletes it from the page.

Add a block to a section

1. In the block list, select the section you want to add to.
2. Click Add block under that section.
3. Pick a block from the list. It is added inside the section and selected.

Blocks reorder, hide, and remove the same way sections do: drag to reorder, click the eye icon to hide, and use Remove block to delete. To move a block into a group, drag it onto the group in the block list.

The header and footer

The Header and Footer show at the top and bottom of every page, so you edit them once and the change applies everywhere. They appear in the block list on every page. Select Header or Footer to open its sections and blocks.

Theme settings

Theme settings are store-wide options that apply across every page, such as Colors, Typography, Animations, Logo, Buttons, and Product cards. Open them from the Theme settings icon at the bottom of the sidebar. A color scheme or font you change here updates every section that uses it.

Tips

• Save often. The editor holds your unsaved work in the session, but a change is not live until you click Save.
• Use the page picker to confirm a change on the page it belongs to. A product setting looks right only on a product page.
• Hiding a section is reversible and keeps its content and settings. Reach for hide over remove when you might want the section back.