Customizing your theme

After you choose a theme that defines the basic look and feel of your online store, you can customize the theme to suit your unique brand. You can customize your theme by using the theme editor. The theme editor includes a preview of your theme and a toolbar that you can use to add and remove content, and to make changes to your theme's built-in settings.

For more advanced customizations, you can make changes to your theme by editing your theme code.

Before you start making changes:

  • Make sure that you understand what level of support is available. You can learn about where to find support for different themes in Shopify Design Policy.
  • Duplicate your theme. Duplicating your theme creates a backup copy, making it easy to discard your changes and start again if you need to.
  • Learn about the requirements and best practices for uploading images.

Customize your theme with the theme editor

The theme editor offers an easy way to customize your store's content, layout, typography, and colors. Each theme provides built-in settings that allow you to change the look and feel of your theme 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.

To customize your theme by using the theme editor:

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

The theme editor shows a preview of the theme and categories of settings that you can change. 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 toolbar has 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.

Edit your theme code

To make in-depth changes to your theme, or to make changes that can't be made in the theme editor, you need to make edits to your theme code. A theme is a collection of code files that control the layout and appearance of your website. Most of the files that make up a theme contain Liquid, Shopify's templating language. These files have the extension .liquid, and are known as Liquid templates. Theme files also contain HTML, CSS, and JavaScript. Edit the code for a theme only if you know HTML and CSS, and have a basic understanding of Liquid.

To edit your theme code:

  1. Click Actions > Edit code.

On the Edit code page, you can edit the existing files and add new ones. The page shows a directory of theme files and a code editor:

The code editor page

When you click a file in the list, it opens in the code editor. You can open and edit multiple files at once. Click Save to save your changes.

Get help with customizations

If you need help with making changes to your theme, then you can contact your theme's developer for support.

To see what other resources are available to help you with theme customizations, see Additional resources for theme support.

Want to discuss this page?

Visit the Shopify Community

Ready to start selling online with Shopify?

Try it free