Theme sections

For themes with sections, Shopify's theme editor offers an easier way to customize your store's home page content. You can add, reorder, and remove content on your store's homepage using sections. Sections let you customize your store's design and content in a quick and visual way.

The theme editor has been updated to support themes with sections. If you are using a theme that does not have sections, then you can still have access to the new theme editor.

All Shopify's free themes support sections. Soon, all themes available in the Theme Store will support sections.

Introducing sections

Sections are customizable parts of your theme. They let you add, reorder, and remove chunks of content on your store's home page. Each theme has a unique set of sections to choose from. Sections let you pick the types and order of content you want to feature on your home page. Examples of sections include featured products, slideshows, collection listings, or videos.

Within a section, you can add different types of content. These content types make up the content inside each section of your home page. Each section in a theme has its own content types that you can add. Some examples of content types within sections are products, text, or images.

When you add content like images and videos to your store, you can use that content in your theme sections.

Fixed sections

Most themes that use sections will have fixed sections that can't be moved, usually the theme's header and footer. Although you can't move fixed sections around, you can still customize their content the way you want.

New theme editor

The theme editor has changed to allow you to add and reorder sections in your theme. The new theme editor menu appears on the left side of your browser window:

Sectioned theme editor

If you are using a theme that does not support sections, then the new theme editor might still display. Click here for details about customizing a non-sectioned theme with the new theme editor.

Sections and General settings tabs

The theme editor is divided into two tabs: Sections and General settings:

  • The Sections tab shows the sections that are available with your theme. You can use the Sections tab to add content and move content:
Sectioned themes sections tab

Note

If you are using a theme that does not have sections, the Sections tab does not include any content.

  • The General settings tab lets you make global changes to the look of your store, including typography, text and background color, and links to your social media accounts:
Sectioned theme settings tab

Theme styles

Presets have been renamed to theme styles in the new theme editor. To change your theme style, click the Change theme style button, which is available on the General settings tab, then click the theme style you want to use:

Reset theme style

You can use the Change theme style button to reset your theme settings to a default state.

Add content

You can add sections to your home page using the theme editor menu:

Note

These instructions only apply to themes that support sections.

  1. From your Shopify admin, click Online Store, and then click Themes (or press G W T).

  2. Find the theme you want to edit and click the Customize theme button for the theme.

  3. In the sidebar menu, click Add section:

    The theme editor's 'Add section' button
  4. Click the type of section that you want to add, then click Add. The options are theme-specific, so different themes will have different section options.

  5. Change the section's content by adding and editing the content blocks using the sidebar menu.

  6. When you like the way the section looks, click Save or Publish to save your changes to the theme.

Tip

When you add an image file to a section, the file is added to your store's files in the files section of your admin. You can then reuse this image in other sections or pages of your store.

Move content

You can change the order of the sections on your theme home page. In the theme editor's sidebar menu, click ⁞⁞ on the section you want to move and drag the section to where you want to move it:

Moving a section in the theme editor

The preview of your theme will update to show the section in its new location.

Remove content

You can remove sections and content that you've added to your home page:

Remove a section

  1. From your Shopify admin, click Online Store, and then click Themes (or press G W T).

  2. Find the theme you want to edit and click the Customize theme button for the theme.

  3. In the sidebar menu, click the section that you want to remove.

  4. Click Delete section at the bottom of the sidebar menu.

Remove content from a section

  1. From your Shopify admin, click Online Store, and then click Themes (or press G W T).

  2. Find the theme you want to edit and click the Customize theme button for the theme.

  3. Click the section containing the content that you want to remove.

  4. In the Content section, click the content you want to remove from the section.

  5. Click Delete [content], where [content] is the content type (collection, image, or logo, for example).

Tip

Deleting content in this way just removes the home page content — it doesn't delete things from your store. If you delete a product or collection block from a section, that product or collection will still exist in your Shopify store. If you delete an image in a section, you can still add that image to other content blocks.

Using themes that do not support sections

If you are using a theme that does not support sections, you do not need to make any customizations to your theme. Your store will look and function the same way it did before.

When you customize your theme, the new theme editor will display. You can update and publish your theme using the new theme editor, although you will not be able to reorder sections in your theme. If you want to use a theme with sections, visit the Theme Store to install sectioned themes as they become available.

Want to discuss this page?

Visit the Shopify Community

Ready to start selling online with Shopify?

Try it free