Skip to content
What is a Local Development Environment Using Shopify Theme Kit?
Introduction
Shopify Theme Kit is a cross-platform command-line tool that allows you to build and manage Shopify themes locally. It enables businesses to easily and professionally customize the look and feel of their Shopify store. Whether you’re using Shopify CLI or Shopify Theme Kit, the setup process is key to creating a seamless development environment for your Shopify store.
However, Shopify CLI is now the preferred tool for most Shopify theme development tasks, especially when working with Online Store 2.0 themes. Shopify CLI should be used for newer themes, while Shopify Theme Kit is specifically recommended for older themes. For those working with the Shopify setup development environment, the choice between Shopify CLI vs Shopify Theme Kit depends on your theme’s version and project requirements.
How to Set Up a Local Development Environment Using Shopify Theme Kit?
This guide will walk you through the steps to get started with Shopify Theme Kit, which is particularly useful for creating a local development environment using Shopify Theme Kit and integrates with the Shopify ThemeKit app.
Step 1: How to Install Chocolatey for Shopify Theme Kit?
Before installing Shopify Theme Kit, you’ll need to install Chocolatey (a package manager for Windows), which is a free tool that simplifies the installation of software packages like Shopify Theme Kit.
Installation Process:
- Open the following URL in your browser:
Chocolatey Installation Guide
https://shopify.dev/docs/storefronts/themes/tools/theme-kit/getting-started
- Click the Try it now button.
- Open PowerShell on your Windows system. Right-click on it and select Run as Administrator.
- Check the current execution policy by typing the following command:
“Get-ExecutionPolicy”
- If the policy is restricted, change it by entering this command in PowerShell and hitting Enter:
bash
Set-ExecutionPolicy Bypass -Scope Process -Force; [System.Net.ServicePointManager]::SecurityProtocol = [System.Net.ServicePointManager]::SecurityProtocol -bor 3072; iex ((New-Object System.Net.WebClient).DownloadString(‘https://community.chocolatey.org/install.ps1’))
- Chocolatey will now be installed on your system.
Step 2: How to Install Shopify Theme Kit?
Once Chocolatey is installed, you can use it to easily install Shopify Theme Kit. This is a part of the Shopify setup development environment process for local development.
In the same PowerShell window, run the following command to install Shopify Theme Kit:
Bash choco install theme kit
You can also find Shopify Theme Kit GitHub repositories and detailed documentation to understand more about its usage and integration with Shopify themes.
Ready to launch your Shopify store? We will create a standout site with our development and optimization to build a store that sells.
Contact us now and get your store up and running fast!
Step 3: How to Create a Private App in Shopify for Theme Kit Access?
To configure Shopify Theme Kit access with your Shopify store, you need to create a private app within your Shopify admin.
Follow these steps:
- Log in to your Shopify admin dashboard.
- Navigate to Apps and select Apps and sales channels.
- Click on Develop App, then click Create an app.
- Enter a name for your app (e.g., “Shopify Theme Kit App”) and select Create app.
- Under Configuration, click on Admin API Integration.
6. In the Admin API access scopes section, enable read and write permissions for Themes. Then save your settings.
7. Click on API credentials and install the app.
8. Copy your API password—this will serve as your Shopify Theme Kit password.
Step 4: How to Connect Shopify Theme Kit to Your Shopify Store?
Now, you’ll connect Shopify Theme Kit to your Shopify store, completing the setup for local development.
Follow these steps:
1. Create a folder on your computer where you want to store the downloaded Shopify theme.
2. Inside this folder, create a file named config.yml.
In the config.yml file, add the following store information:
yaml
development:
password: YOUR_THEME_KIT_PASSWORD
theme_id: “live”
store: YOUR_SHOPIFY_STORE.myshopify.com
3. Replace YOUR_THEME_KIT_PASSWORD with the password you copied earlier, and YOUR_SHOPIFY_STORE.myshopify.com with your store’s domain.
4. Open Command Prompt (or PowerShell) and navigate to the folder where you created the config.yml file.
To download the Shopify theme, run the following command:
bash
theme download
Once the theme is downloaded, run the following command to watch for changes in the local environment:
bash
theme watch
5. This will keep the Shopify Theme Kit running and automatically update the preview whenever you make changes to your theme files.
What Are the Key Shopify Theme Kit Commands?
Once you have the Shopify Theme Kit set up, you can use various Shopify Theme Kit commands to manage your development workflow. Some of the most common commands include:
- theme download: Download your Shopify theme to your local environment.
- theme watch: Watch your theme files and auto-upload changes to your Shopify store.
- theme upload: Upload local theme changes to your Shopify store.
- theme open: Open your Shopify store’s theme in a web browser.
These commands allow you to work locally and sync your changes with your Shopify store seamlessly.
Why Choose Shopify CLI vs Shopify Theme Kit?
When deciding whether to use Shopify CLI or Shopify Theme Kit, it is important to consider the type of Shopify theme you’re working with:
- Shopify CLI is recommended for newer Online Store 2.0 themes as it supports advanced features like sections and blocks.
- Shopify Theme Kit is specifically for older themes that do not support Online Store 2.0 features.
If you’re working with an older Shopify theme, Shopify Theme Kit remains a valuable tool for managing your local development environment. However, if you’re developing Online Store 2.0 themes, you should prefer Shopify CLI.
Conclusion
Your Shopify Theme Kit setup is now complete. You can begin making changes to your theme files locally and watch them reflected in real-time as you develop your Shopify store. Whether you’re using Shopify CLI vs Shopify Theme Kit or working with the Shopify ThemeKit app, you now have a streamlined process for theme development.
For additional resources, you can explore Shopify Theme Kit GitHub for further documentation and updates on new features.
