Find by Category

Shopify Store 2.0 Theme Development – Step by Step Walk-Through

by

This post will help you understand how Shopify theming is done in online store 2.0 and along the way you’ll be able to create your own custom Shopify Store 2.0 theme from scratch.

There are two ways to create Shopify themes for store 2.0 store. First – you can fork Dawn theme, second – you can create Shopify theme from the scratch. This post will briefly cover both, but mainly the second way, which is creating Shopify theme from the scratch for store 2.0.

This post will also help upgrade your old Shopify themes to store 2.0 theme with the help of JSON templates.

Shopify Theme Development Environment

Shopify Theme dev environment is easy now, you just need to install the latest version of Ruby, NodeJS, and I assume that you already have installed git, but if you don’t, kindly have git installed too.

  1. Ruby
  2. NodeJS
  3. git

Once you have installed Ruby 2.7+, you can install shopify-cli to create Shopify theme, Shopify apps, and populate store data too.

gem install shopify-cli

To check shopify-cli version, run the following command.

shopify version

Last but not the least, you should already have your favorite web-browser and text-editor.

  1. Web Browser
  2. Text Editor

Needless to say, but you also need to create a Shopify partner account and a Shopify development store, which are free to create.

  1. Shopify Partner’s Account
  2. Shopify Development Store

Create Shopify Theme

Let’s create our very first Shopify theme based on Dawn theme, which is forked as you create the store 2.0 theme with shopify-cli.

Get into the folder where you would like to create Shopify store 2.0 theme based on Dawn.

Navigate your terminal/CMD to the folder where you want to create the theme, and run the following command.

shopify theme init THEME_NAME

You can run the following commands with shopify theme as a flag

  • init
  • serve
  • pull
  • push
  • delete
  • check
  • publish
  • package
  • language-server

Change directory to your Shopify them name and try commands listed above like, 

cd THEME_NAME && shopify serve

But this command will ask you to connect this theme to your Shopify development store first.

Connect Theme with Shopify Development Store

To connect your local theme with your Shopify Development Store, run the following command.

shopify login --store=DEV_STORE_URL

Select your partner’s account and run the shopify serve command again, this time you would have a local URL, a Theme customization URL and a public preview URL too.

This theme will be saved as a draft theme on your development store.

So, this theme was created based on DAWN theme, now you can customize this theme and use it for free and sell it to your clients.

In the next post, I’ll write about creating a Shopify Store 2.0 theme from the scratch.

Shopify Store 2.0 Theme Development Course

If you are looking for a hands-on Shopify Store 2.0 Theme Development course that demonstrates how everything is done. Which will be every simpler to understand, think, and visualize, then here is a course that you might like.

Dawn Theme Shopify Help

If you are looking for a Shopify Dawn Theme developer to design, develop, and launch your Shopify store in no time, please let me know your business requirements at [email protected]

I can help you with the followings

  1. Dawn Theme Customization
  2. Shopify Store Launch
  3. Custom App Extension Development
  4. Product Upload
  5. Shopify SEO
  6. Sync Shopify Products to Facebook Shop
  7. Sync Shopify Products to Google Shopping
Email Your Query & Requirements

I also offer support and help.

Related Posts

Table of Contents show