Shopify Custom Theme Development

Complete Guide To Shopify Custom Theme Development Using Theme Kit

September 20, 2022Posted By: Akshay Shah
CustomizationShopify ToolsTheme Development


There is no denying that Shopify’s custom theme development is gaining popularity in the eCommerce industry. It’s a hot topic among Shopify experts worldwide for creating top-notch online stores. As developers, we recognize Shopify’s significance due to its outstanding performance. It stands out as one of the best eCommerce platforms, making online selling and customization a breeze.

Offering essential features for startup and mid-level stores, Shopify has proven reliable in my 8+ years as a hired Shopify expert. Remarkably, I’ve never encountered downtime during maintenance or updates by the Shopify development team. The platform’s user-friendly admin GUI ensures even non-technical users can navigate it effectively. This means individuals with solid technical skills can effortlessly use it, making it worth considering, even for those from a non-technical background.

Creating a Shopify store or custom design is straightforward. However, as a hosting-based solution, source code editing occurs in the admin area, requiring developers to work in the browser. While this is common in hosting-based solutions, developers often prefer their code editors, such as ATOM and Visual Studio Code for JavaScript developers. Various code editors like Bracket for creative CSS or HTML developers and Sublime for everyone else are available in the market.

Shopify lets you download the theme source code, edit it, and then upload the theme or save the edited files in your preferred code editor before coding. Recognizing the inefficiency of this process, Shopify provides two different solutions for the same, catering to the needs of developers in the Shopify custom theme development and custom Shopify development landscape.

There are two solutions to consider in the Shopify custom theme development. The first involves coding in the admin area, offering relief as it avoids affecting the live store with syntax errors. However, developers always feel more comfortable with their code editor when using this custom Shopify development option.

On the other hand, the second solution revolves around the theme kit option. As a Shopify expert or Shopify solution provider, I select it. Although most developers are well aware of theme kits in custom Shopify development, there might be a few who are new to it and should know more about it. In this post, I will shed some light on this feature and walk you through how it works, eventually helping you understand why you should opt for it. We use this solution while working on our Shopify projects.

What Is A Theme Kit?

Shopify Theme Kit for eCommerce Development

Crafting eCommerce stores is simplified with Theme Kit, a fantastic command-line tool designed for Shopify themes. It greatly eases developers’ lives, allowing them to download the entire theme to their local system. Utilizing an editor, you can make changes and, upon saving, witness seamless upload to your chosen theme. If you’re a Shopify expert yet to explore this method, the following steps can be immensely helpful.

For Mac OS Installation Using The Terminal

Those good at the terminal know that Homebrew is extremely useful. However, if you are someone who is not very familiar with it, you can install it quickly by referring to this link.

Once you have Homebrew in your system, you just need to follow the below steps to install the Theme Kit.

brew tap Shopify/Shopify brew install themekit

For Linux/Ubuntu

For this well-known operating system, you need to run the following command from your terminal to have the latest version of Theme Kit.

curl -s | sudo python

For Windows Installation

For Windows, which is one of the most popular operating systems of all time, you need to have Chocolatey in your system. Maybe you can install it without Chocolatey, but as a Shopify expert, I use it, so I would like to show you how I go about the installation process.

If you want to try Chocolatey, download it from this link.

choco install themekit

When I did not have the experience of this terminal, I used to find it hard to deal with these terminals. You can download it manually from here if you have the same fear or issue.

After completing the manual or terminal process of installing the Theme Kit, you can then connect your Shopify store with the Theme Kit. Shopify will not allow you to upload any plugin from the admin panel. However, ‘where there is a will, there’s a way.’ Shopify allows you to connect with your store by using API. You can develop the Shopify app (private app).

You can consider the following steps to create the app to connect with your store

To create a private app, go to the Shopify admin, find the apps option, and click on it. Once you do that, you will see ‘manage private apps,’ you can then create a new private app. It will also help you in the future if you want to become a Shopify expert.

Fill out the required information and set the permission of the theme template and assets. You need to give permission wisely over here. Ideally, to utilize all the features of Theme Kit, you need Read and Write access. Select the read and write access from the drop-down and press save; you will get to the next screen. In it, you will see all the essential credentials, which we need later while connecting the store using Theme Kit. Scroll down to the video that describes the process mentioned above.

Your browser does not support HTML5 video.

Now you are ready to use Theme Kit, let’s check how you can see the existing theme list and configure it.

Note: Before running the command, you must reach the path to download your theme and assets. Once you do that, I will show you how to download the theme using the Theme Kit.

We all know that no Shopify developer works on multiple themes simultaneously. So, for theme customization in Shopify, you will have to use one theme at a time. However, to get that one theme, you must have the theme id for it. You can find the theme id from the preview link id. It is important for you to understand that the theme ID and preview link ID are the same; however, why not see the preview link when you can have full access using Theme Kit?

You can consider the below steps to get the theme list quickly:

theme get –list -p=[your-password] -s=[]

Here, remember your password; it will be your store password, so use a recallable password instead of a generic one. By the above command, you will get the theme ID.

Now, please make a note of the theme ID that you wish to configure.

theme get -p=[your-api-password] -s=[] -t=[your-theme-id]

Now, you can run the above command to configure that theme, which you need to customize. In theme ID, you only need to place your noted theme ID.

Another quick note: The theme kit also has some required parameters and some optional parameters.

Environment Command

These commands are always useful to the developers. You can use the different environments by naming them with the –env flag or -e flag. Here -e is the short form of the environment command. Shopify’s default environment is ‘development’, just like other CMS. If you wish to deploy the production environment, then you probably need to run the code below:

theme deploy –env=production

Configure Command

Once you have decided on your environment, it is time to configure those environments in the config files. Here, you can create and update the configuration file by following the below command.

theme configure –password=[your-api-password] –store=[] –themeid=[your-theme-id]

I hope I do not need to tell you about the parameters. You may know all of them. You can see the config.yml in your directory from where you run this command.

Deployment Command

Deployment is a well-known process in our industry. We do not need to elaborate on this; therefore, I will show you the command directly on this.

theme deploy

You can run the deployment command with or without file names. If you provide file names, it will only replace or deploy those files. Also, you need to give the full path, for instance:

theme deploy section/product-grid.liquid

Download Theme Command

The complete theme will be retrieved if you call the command directly, like below.

theme download

If you need to download specific files, you must give the exact path based on the Shopify architect. The example command is below :

theme download templates/theme.liquid templates/article-detail.liquid

Create A New Theme Command

To create the new theme directly, you can apply the following command.

theme new –password=[your-api-password] –store=[] –name=”Shopify Development Theme”

​​Remove File Commands

Developers often make typo mistakes while creating the file in Shopify. Now, they can remove it by using the below command.

theme remove templates/404. liquid templates/articles.liquid

Watch Command

It is one of the most significant commands. Those who are node developers will be happier by seeing this command. This command will run continuously on the system. Whenever you make modifications, this command will have the watch on it. Once you save the file, it will save the file directly on the Shopify store.

Here is that superpower command:

theme watch

Many other commands are provided by Theme Kit. To check them, you can use the help command.

theme help theme [command] –help


To conclude this blog, I would like to emphasize that we use the Theme Kit to create custom themes for Shopify, and we like it tremendously for its developer-friendly commands. I would also like to say that we always have one copy of the code in the local system. ZealousWeb has acquired such vigilance from years of Shopify coding and effective problem-solving. When you wish to hire Shopify experts for your eCommerce store, you must consider their level of expertise as a crucial decision-making criterion. Shopify Theme Kit is a simple and effective way of adding life to your eStore by ensuring your customers relate to your brand.

If you have any questions regarding this, you can reach us at We will solve your queries as soon as possible.


Why Should Developers Choose Shopify For eCommerce Development?

What Is Shopify Theme Kit And How Does It Simplify The Development Process?

What Are The Essential Commands And Steps To Use Theme Kit Effectively?

Related Blog Posts

Shopify Partner Agency

What Is A Shopify Partner Agency? Do You Need One?

eCommerceShopify Partner AgencyWebsite Development
Flow Form is a Game Changer

Why Is Flow Form A Game-Changer For Webflow Developers?

Advanced WebflowFlow Form MasteryFramework Advancement
Hire a webflow agency

Top Reasons To Hire A Webflow Agency For Your Web Development Project

Agency BenefitsFramework FlexibilityWebflow Advantages
Webflow for Businesses

7 Key Advantages Of Webflow For Enterprise Businesses

Enterprise SolutionsFramework AdvantagesWebflow Benefits
Migrating from Shopify to WooCommerce

Migrating Products Transitioning From Shopify To WooCommerce

E-commerce PlatformsProduct MigrationShopify to WooCommerce
Hire Shopify experts

Top Reasons To Seek Assistance From Shopify Experts

Expert SupportShopify SolutionsStore Optimization
eCommerce Mobile Application

Building Your Shopify eCommerce Mobile App Step By Step

App DevelopmenteCommerce TipsMobile Integration