Skip to main content

Navigating the theme editor

The theme editor is where you set up Wise: you add and arrange sections, fill in your content and change the theme's colors and fonts, with a live preview of your store. This guide shows you where everything is.

Open the theme editor​

  1. In your Shopify admin, go to Online Store > Themes.
  2. Click Customize next to Wise.

The editor layout​

  • Left sidebar: The sections and blocks of the page you are viewing. Icons at the far left switch between sections, Theme settings (the gear icon) and app embeds.
  • Preview: A live preview of your store. Click anything in the preview to jump to its settings in the sidebar.
  • Top bar: The page selector in the middle, the desktop and mobile preview buttons, and Save on the right.

What you see in the sidebar​

The sidebar is split into four parts, from top to bottom.

Header group​

The sections shown at the top of every page: the Announcement bar and the Header. Changes here apply to your whole store, whatever page you are viewing.

Template​

The sections of the page you are viewing, for example the home page or a product page. Each page type has its own template, so sections you add here only show on that type of page. See Switch between pages.

The sections shown at the bottom of every page: by default a Features banner and the Footer. Like the header group, it is the same on every page.

Drawers & Popups group​

At the very bottom of the sidebar you find the Drawers & Popups group. It holds the parts of your store that open on top of the page:

These are separate sections, not part of the header, even when they open from a header icon. They are shared by every page.

tip

To edit a drawer, click its section in the Drawers & Popups group. The preview opens the drawer so you can see your changes.

Sections and nested blocks​

Every section in the sidebar can be expanded to show its blocks. In Wise, blocks can hold other blocks, so the sidebar shows a tree several levels deep. For example, the header looks like this:

  • Header
    • Logo
    • Menu
      • Mega-menu
        • Mega-menu image
    • Menu aside
      • Search, Account, Cart and other icons
    • Color presets

Click the arrow next to a section or block to expand it, and click its name to open its settings.

  • Add a section: Click Add section in the header group, the template, the footer group or the Drawers & Popups group. The list only shows sections that fit in that place.
  • Add a block: Expand the section or block and click Add block. If you do not see Add block, try one level up.
  • Reorder: Drag sections and blocks by the handle on their left.
  • Hide: Point at a section or block and click the eye icon. It stays in the editor but is hidden in your store.
  • Remove: Open the section or block and click Remove at the bottom of its settings. Fixed blocks, such as the Logo block in the header, cannot be removed.

Read How sections and blocks work in Wise to learn about fixed blocks, theme blocks and section presets.

Theme settings​

Click the gear (settings) icon in the left sidebar to open Theme settings. These settings apply to your whole store:

Switch between pages​

Use the page selector in the top bar to switch between templates, for example Home page, Products, Collections, Pages, Blogs and Cart. Each template has its own sections. The header group, footer group and Drawers & Popups group stay the same on all of them.

To show a specific product or collection in the preview, open the template and use the Change option in the page selector to pick it.

Preview on mobile​

Click the mobile icon in the top bar to preview your store at phone size. Many Wise sections have separate mobile settings, so check both views before you publish.

Save your changes​

Click Save in the top bar. If the theme is not published yet, your customers do not see the changes until you publish it.