BPH Resources


Online resourcing for Digital and SEO Help

Install Shopify Theme locally (and edit in your local enviornment)

Customizing your shopify theme can be pretty extensive work. The online GUI is powerful but if you are a developer like me, there are definitely some things you wish you could tweak that the gui simply does not allow. That is what I'm here to help. This is a step by step guide to get your local enviornment set up correctly to edit and customize your shopify theme in your local enviornment.

Step 1

Download ThemeKit

ThemeKit is a custom tool built specifcally for shopify that communicates with your theme and allows you to edit the theme from you locally enviornment without you having to do any of the heavy lifting like pushing files every time you make a new change


Step 2

Install Theme kit

Since this is a Mac Specific install, this should be the link to curl the necessary files. Open your favorite terminal and enter
curl https://raw.githubusercontent.com/Shopify/themekit/installers/install | python

Once themekit has been sucessfully installed, restart and open the terminal and enter theme --help to verify that the install was successful

Step 3

Set Up API Access to your theme

To do this go to your shopify store and navigate to the Apps section in the left hand nav

Click Create Private app

Fill out your description and contact email ( which will be where the theme is sent to you)

In the permissions section, make sure that Products,variants and collections OPtions is set to Read and Write, as well as the Scripts and Themes template Options

Once that is all set up click save app to be presented with the necessary authentication tokens so that themekit can communicate with your shopify theme

Step 4

Download your theme by going into the shopify dashboard, clicking themes, navigate to the theme you want to edit, click the elipses(three dots) and select download theme

Your theme will be sent to your email address

Unzip and place your theme in your desired directory

Step 5

Located you theme ID, which can be found clicking on customize theme in the dashboard, the id is the numbers in the url

Step 6

Navigate to the director where you place your theme and enter the directory,i.e cd Themes && cd mytheme

Create a new file in the root directory of the theme called config.yml, you can do this by typing touch config.yml in the terminal

Open the config file and structure it like so

development:
theme_id: YourThemeIdGoesHEre
access_token: your API KEY goes here
password: your API Pass word goes here
store: yoursitename.myshopify.com
ignore_files:
- config.yml

Save the file

Step 7

In your terminal, while in your theme directory run theme watch, so that theme kit can watch any changes

Step 8

Make changes to your theme and refresh you shopify page to see the changes happen!


Following these steps should allow you to set up your shopify theme for editing in your local enviornment

Happy Coding