Customizing your store

Shopify's theme editor offers an easy way to customize your store's content, layout, typography, and colors. Each theme includes built-in settings that allow you to change the look and feel of your store without editing any code. The theme editor includes a preview of your store, so that you can see the way your changes will look before publishing them.

Using the theme editor

To customize your store by using the theme editor:

  1. Click the Customize button for the theme that you want to customize:

    The Customize button on the Themes page in the admin

The theme editor shows a preview of the theme and categories of settings that you can change:

The theme editor

Different types of pages have different theme sections. When you open the theme editor, the settings for the home page are shown by default. To access the settings for other pages, select the page type from the top bar drop-down menu:

Theme editor top bar drop-down menu

The theme editor is divided into two tabs: Sections and Theme settings. On the Sections tab, you can modify the content and layout of the different pages on your store. On the Theme settings tab, you can customize your store's fonts and colors, and make changes to your social media links and checkout settings.

Sections

Tip

If you want to see more educational videos and tutorials like this one, visit our video library.

Sections are customizable parts of your theme. With sections, you can add, reorder, and remove blocks of content on your store's home page. Each theme has a unique set of sections to choose from. You can pick the types and order of the 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, and images.

The Sections tab shows the page content that is available with your theme. Each part of a page is called a section. You can use the Sections tab to customize sections, add more sections, and move sections around on the page:

The Sections tab in the theme editor toolbar

All Shopify themes in the Theme Store use sections. Themes created before October 2016 do not support sections.

Fixed sections

Most themes that use sections have some fixed sections that you can't move, such as the Header and Footer sections. Although you can't move fixed sections around, you can still customize their content the way you want.

Add sections to your store

To add sections to your home page:

  1. From your Shopify admin, click Online Store > Themes.

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

  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.

Change the layout of a page by moving sections

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.

Hide a section

You can hide sections that you don't want to display in your store. You can hide sections that are unfinished, or that you are not ready to display. For example, you can create a slideshow section of new products, and then hide the section until you are ready to begin selling the new products. Or, you can create a section that advertises a seasonal discount, and then hide the section until the discount is active.

  1. From your Shopify admin, click Online Store > Themes.

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

  3. In the sidebar menu, click the eye icon for the section that you want to hide:

Theme sidebar menu with eye icon highlighted

When a section is hidden, the eye icon will have a slash through it:

Theme sidebar menu with hidden section

Remove sections from your store

You can remove sections and content from your home page.

Remove a section

  1. From your Shopify admin, click Online Store > Themes.

  2. Find the theme you want to edit and click the Customize 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 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).

Theme settings

Tip

If you want to see more educational videos and tutorials like this one, visit our video library.

You can make global changes to your store on the Theme settings tab. Theme settings include typography (fonts), text and background color, and links to your social media accounts:

The Theme settings tab in the theme editor toolbar

You can also make some changes to the theme settings from the Sections tab. For example, with some themes, you can add social media icons to the Footer section of your store. When you customize the Footer section on the Sections tab, the social media icons will be available for you to customize:

Editing Theme settings for footer content

Changing theme styles

Each theme has at least one theme style, which is a collection of the colors and styles used on your store. To change your theme style, click Change theme style in the Theme settings tab, then click the theme style you want to use:

The Change theme style button in the theme editor toolbar

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

Undoing and redoing changes

The Undo button reverses your most recent change, and the Redo button adds back a change that you undid. Clicking the Undo button more than once will continue to undo your work, one change at a time. You'll find the undo and redo buttons at the bottom of the theme editor:

The Undo and Redo buttons in the theme editor toolbar

Click the undo button to reverse the following changes:

  • adding, reordering, and deleting sections
  • applying colors, fonts, and other settings, on the Theme settings tab
  • resetting a theme style.

Want to discuss this page?

Visit the Shopify Community

Ready to start selling online with Shopify?

Try it free