The Essential List of Resources for Shopify Theme Development

Shopify Theme Development Resources and Tutorials: 2016

Whether you are starting out with Shopify Themes or are a seasoned Shopify Expert, there are always new and useful things to learn that will help with your everyday theme development. With so much content available at your fingertips, one of the problems (at least for me) is knowing where to start.

With that in mind, we have pulled together a structured list of articles, videos, and online courses to help you on your way. As Shopify changes, we’ll constantly be adding new items to keep the list up-to-date and fresh. We want to provide you with our best and most accurate resources on theme development and production. I strongly recommend you take a moment to bookmark it for future reference.

Naturally, some articles will touch on advice and guidance from others, but each one is packed full of content that will help you learn more about developing themes for the Shopify platform. You can start at the beginning, or dive into an appropriate section — the choice is yours.

Finally if you have an article that should be included in the list, please let us know in the comments.

Are you working with Visual Studio Code for development? Check out our article on thebest Visual Studio Code extensions.

Online theme development courses

To build themes, you need to understand Shopify’s core features and functionality as well as the front end development tools and frameworks. If you are brand new to the Shopify platform, the following structured online courses will take you from newbie to expert in four and a half hours.

Working with Shopify Themes

Themes are the basis of every Shopify store. These articles will introduce you to the structure of a Shopify theme, explain when each template is rendered, give you a pre-launch checklist, and discuss tools that can help with your Shopify development workflow.

Template Icon

Your Shopify theme toolkit

开源工具加快和简化Shopify Theme development.

Designing for Shopify

Great ecommerce website design is about so much more than aesthetics. These articles focus on the design and UX of building Shopify Themes. Here you can find a list of articles to help you design home pages, product pages, and cart templates, and a free CSV file to get your development store up and running.

Grow your business with the Shopify Partner Program

Whether you offer marketing, customization, or web design and development services, the Shopify Partner Program will set you up for success. Join for free and access revenue share opportunities, tools to grow your business, and a passionate commerce community.

Sign up

Liquid template language

Liquid is the bridge between a store’s data and its theme templates. These articles will cover the basics of how to use Liquid in Shopify Themes. If you are brand new to Liquid, start with An Overview of Liquid to familiarize yourself.

Liquid templates

From in-depth looks at individual templates to discussions on how you can leverage the power of alternate template and layout files, these articles will help you take your theme building to the next level.

Shopify Theme images

Images are the key to a great ecommerce experience. There are plenty of ways to customize images in Shopify — from clever use of variant images to Liquid filters, which allow you to crop and resize.

Snippets

Leverage the power of the DRY (Don’t Repeat Yourself) principle in your themes by using snippets effectively — these articles will teach you how.

Link lists, menus, and navigation

There’s a lot more to menus than you might think. From information architecture to SEO benefits, learn how to extract maximum potential from the humble “link list”.

Shopify Theme Sections

部分让你让商家给他们greater flexibility when customizing their online store. This feature allows them to easily add or move content on their homepage with just a few clicks.

CSS in Shopify Themes

There are plenty of reasons to add useful CSS hooks to your templates. Learn how, and why, this can help you make your theme building more effective and powerful.

Shopify Themes and JavaScript

Shopify Themes do not require JavaScript — however, by progressively enhancing your templates, you can add functionality that will delight customers.

Metafields

Learn how to make the most of theShopify metafieldsfunctionality and bulk editor feature.

Shopify API

Thousands of apps and integrations are available in theShopify App Storethanks to the powerful Shopify API. Here’s a primer to whet your appetite.

Theme performance

A little can go a long way — especially when it comes to theme performance. Learn how Shopify Experts squeeze gains out of each and every theme they produce. Better performance = happy customers = happy merchants.

Using web fonts in Shopify Themes

Adding web fonts to a theme is a common request. The following article will teach you how to do just that.

Official resources

As well as regularly published tutorials on theShopify Web Design and Development Blog, we also recommend the following official Shopify Theme-related resources. Both theLiquid Cheat SheetandLiquid Code Examplesare worth bookmarking.

Create a development store to test your themes

As a Shopify Partner, you have access to a free development store to experiment with and test your themes. Follow the link below to create your development store today. Not yet a Shopify Partner?Sign up now.

Create development store

Grow your business with the Shopify Partner Program

Learn more