4 Advanced Shopify Theming Techniques to Add to Your Workflow

If you work with Shopify Themes, you know that developing a strong understanding of the basics of Liquid is just the start. There are countless tips, tricks, and hacks you can use to reinvigorate your theme design process and, ultimately, make you more efficient.

This article will provide you with an overview of four advanced theme development techniques that were covered in our most recent Partner Session webinar. I hope you find these code snippets and resources useful as you build your next store or theme on Shopify.

Setting up our store

The first thing we did in the Partner Session was import a set of products and create product collections to provide us with live product data to work with, like product variants and images. We recently published a set of product CSVs and images that you can start using for your own shops, designs, and mockups. To learn how you can use these product CSVs and images, check out our step-by-step guide!

Quick Liquid overview

In order to get started with advance theme building techniques, you’ll need a pretty solid understanding of Liquid concepts. If you’re new to Liquid or looking to learn a new language, check out our collection of Shopify Tutorials on the Shopify Web Design and Development Blog.

How Liquid output tags work

How Liquid filters work

Now that we’ve got a basic understanding of Liquid, let’s take a look at four advanced theming techniques you can add to your workflow.

You might also like: An Overview of Liquid: Shopify's Templating Language

Advanced Theme Technique 1: Dynamic Product Type Tags

Dynamic product type tags are a great way to improve the buying experience in your client’s store. Dynamic product type tags make it easy for buyers to click on a product type, such as jackets, and browse all similar product types. Buyers can also click on particular tags like brand, year, women, or men depending on the tags set up on the store. The following code snippet will create a clickable dynamic product type tag and will list all associated tags for that product which will also be clickable.

Show type:

Display and add links to all product tags:

Advanced Theme Technique 2: Customizable line properties

If you would like to request information from a buyer, such an engraving details, you can add a line item property to your product page to request that information. Just insert the following code snippet to add a line property to any product page:

You might also like: The Power of Link Lists

Advanced Theme Technique 3: Snippets

Why use snippets? Snippets help us reuse and repurpose lines of code, and they also help us  organize long templates into just a handful of snippets. For example, the following code snippet will return a list of 5 related products:

If you’re looking for more information about incorporating these into your workflow, check out our top tips for using snippets.

Advanced Theme Technique 4: Custom collection templates

In the partner session, we discussed how we can create an order form from a collection using a custom collection template. Your client may have buyers who buy products in bulk and an order form is a good way to improve that buying experience. The following code will create an order form for our collection. To learn more about the following code, check out our documentation.

You might also like: The Essential List of Resources for Shopify Theme Development

Join us for our next Partner Session

Head over to our webinars page to register for upcoming webinars and to check out our previous Partner Sessions.

Grow your business with the Shopify Partner Program

Learn more