Customize a theme

As a theme developer, you can customize themes for Shopify merchants. These customizations might range from small tweaks to complete redesigns. Shopify experts can offer theme customization services through the Shopify experts marketplace.

In this tutorial, you'll use Shopify CLI to customize a merchant's theme and then share your progress with them.

If you're customizing a theme for a client, then you should also review our best practices for working with merchants.

What you'll learn

After you've finished this tutorial, you'll have accomplished the following:

  • Gained access to the merchant's store
  • Set up your local development environment
  • Downloaded a copy of the merchant's theme
  • Made a change and previewed it
  • Shared your changes with the merchant
  • Published your changes

Step 1: Request access to the merchant's store

To work on a merchant's theme, you should request access to their store. Working on a theme in a merchant's store lets you test it with the merchant's products and other resources.

You should request a collaborator account with the the Manage themes permission or Themes permission for the store. Collaborator accounts give you access to only the sections of a store that a merchant wants you to access, and don't count toward a store's staff limit.

Step 2: Install Shopify CLI

If you haven't done so already, install Shopify CLI. Shopify CLI is a command-line tool that helps you to build Shopify themes. It lets you preview, test, and share changes to themes while developing locally. Follow the instructions below to install Shopify CLI on macOS or Windows. For other platforms, refer to Install Shopify CLI.

macOS (Homebrew)

Windows (RubyGems.org)

Step 3: Authenticate with Shopify CLI

Use shopify login to connect Shopify CLI with the store that you want to work on.

  1. In a terminal, type shopify login --store <DOMAIN>, where <DOMAIN> is the store that you want to log into:

  2. In your browser window, log into the account that's attached to the store that you want to use for development.

Step 4: Download the merchant's theme code

If the merchant doesn't have a GitHub repository for their theme, then you need to download a copy of the theme code to work on it locally.

Use this command to access a list of themes in the merchant's store. You can optionally specify the local path where the theme should be stored.

After you select a theme from the list, its contents are downloaded to the current folder or the specified folder.

Step 5: Make a customization

After you've downloaded the merchant's theme, you can make any necessary changes to the theme code. For example, you can add support for multiple currencies and languages in the merchant's theme using our localization tutorial, or you can make an adjustment to the theme's CSS to change its appearance.

Refer to Next steps to explore additional feature tutorials.

Step 6: Preview your changes

After you make a change to the theme, you can run shopify theme serve to interact with the theme in a browser. Shopify CLI uploads the theme as a development theme on the store that you're connected to.

The command returns a URL that hot reloads local changes to CSS and sections, allowing you to preview changes in real time using the store's data. This preview is only available in Google Chrome.

  1. In a terminal, navigate to your working directory.
  2. Serve your theme by using the following command:

  3. In Google Chrome, navigate to http://127.0.0.1:9292 to open the theme preview.

You can also use this command to generate a preview link and a link to the theme editor for the development theme.

The development theme is destroyed when you run shopify logout. If you need to share your progress with the merchant, then proceed to the next step.

Step 7: Share your changes

To share your changes with the merchant, you need to upload the theme that you're developing as an unpublished theme to the merchant's store. This command returns a link to the online store editor for the theme and a preview link, both of which you can share with the merchant.

Step 8: Publish the updated theme

After the merchant approves the changes, you can publish the theme to make it live in the merchant's store. If you haven't yet pushed your changes to the store, then you need to do so before you publish the theme.

  1. Enter the following command:

  2. Select the theme that you want to publish from the list.

  3. Select Yes to confirm that you want to publish the specified theme.

The theme is published and is now the active theme for the store.

Next steps