Shopify ThemeKit for local theme development [Install & Setup]

Elghorfi Mohamed
5 min readDec 30, 2022

Hello Everyone, and welcome to this new article, today we gonna talk about Shopify ThemeKit, how we can install and set it up on our local machine?.

Photo by Luca Bravo on Unsplash

The ThemeKit, is a tool that allows developers to create, customize, and manage Shopify themes. It is a command-line tool that enables developers to work with theme files locally and deploy changes to a Shopify store. With ThemeKit, developers can create new themes from scratch or customize an existing one using some Shopify theme templates and styles.

ThemeKit also provides a set of commands to manage and deploy changes to the desire theme, also it allows us to watch and directly make change to the theme. Including commands to download, upload a theme, and manage theme assets.

It is a useful tool for developers working on Shopify stores, as it allows them to efficiently manage and customize their store’s theme without having to use the Shopify web interface.

#Headlines

  • Install Shopify Theme Kit.
  • Get API Access.
  • Configure an existing theme or use a new one.

#1 Install Shopify ThemeKit:

⇒ Windows Chocolatey Installation

choco install themekit

Learn more here about installing Chocolatey.

⇒ Linux Installation

curl -s https://shopify.dev/themekit.py | sudo python

⇒ macOS Installation

brew tap shopify/shopify

brew install themekit

#2 Get API Access

Go to Shopify Store, and search ‘Theme Access’, and click the application named Theme Access. Or go directly here.

Click ‘Add App’.

Click ‘Install App’.

From the application interface, hit ‘Create Password’.

Enter Your Name and Your Email. Then click ‘Create Password’.

Check your Email, you will receive an email, open it. And click ‘Get Password’.

From the window opened, click ‘Show password’.

Voilà, here is your API Password. Save it for later, we will need it in the next steps.

Here is a video tutorial on how to get the API password:

#3 Configure an existing theme or use a new one

To configure a theme, follow these steps:

— We need to get the theme ID from our Store, go to desire theme, then click customize. Now we’ll get the ID from the URL,

E.g: https://mohamed-dev-store.myshopify.com/admin/themes/138146578726/editor

— The ID is: 138146578726.
— Create a new folder.
— In the created folder, create an empty file name it ‘config.yml’.
— Copy/paste and replace entries as following

dev:
password: <API password from the previous step>
theme_id: <Theme ID>
store: <Store URL>

E. g, in my case, this is my config file:

dev:
password: shptka_76e3720a67c7cc0cea7f172e1e99ed6e
theme_id: 138146578726
store: mohamed-dev-store.myshopify.com

— Now, now open up a terminal in the created folder and run the following command theme get -e dev or theme download -e devto download the theme to your local machine.

— Or run the following command on your terminal.

theme get --password=<API password from the previous step>
--store="<Store URL>" --themeid=<Theme ID>

E. g:

theme get --password=shptka_76e3720a67c7cc0cea7f172e1e99ed6e
--store="mohamed-dev-store.myshopify.com" --themeid=138146578726

ThemeKit Commands

Run the following command to get help about ThemeKit command.

theme help

Get a list of all the flags for a command

theme [command] --help

Command to create a new theme

theme new --password=<API password from the previous step> --store="<Store URL>" --name="Mohamed Theme"

Command to watch directly on a theme:

theme watch -e dev

Command to deploy to a specific theme:

theme deploy -e dev

Command to get latest changes from a specific theme:

theme get -e dev

Get a Specific file:

theme get -e dev sections/section-2.liquid

Command to remove specific file or multiple files:

theme remove -e dev sections/section-1.liquid
theme remove -e dev sections/section-1.liquid sections/section-2.liquid

Manipulate commands on live theme:

In order to use these commands on the live theme, we should force writing on the theme, especially on the command that pushes on theme, we should add a flag--allow-live

E.g: We want to deploy our local version to the live theme, we type the following command and adding the--allow-live parameter.

So, our command became:

theme deploy -e live --allow-live

Now you should be able to use Themekit with your Shopify Store.

#Useful Resources

So, this is the end of our article today, I hope you learned something from it.

Have a wonderful, great day. Don’t hesitate to contact me if you have any questions. If you face any issues, you can reach out to me.

Follow me for more:

Buy Me a Coffee, Maybe?

--

--

Elghorfi Mohamed

Frontend || Shopify Expert Developer || Shopify Consulting