Back
What is Shopify’s Liquid?

What is Shopify’s Liquid?

If you’ve spent any time researching Shopify, chances are you’ve encountered the term ‘Liquid’ or ‘Shopify Liquid’. Like any technical jargon, it can seem confusing and overwhelming at first. 

But today, we hope to shed some light on Shopify Liquid: what is Shopify Liquid, what uses does it have, and how could knowing this template language help store owners? We’ll cover that and more in this guide on Liquid. 

What is Liquid for Shopify?

shopify liquid code

Liquid is Shopify’s programming language. It’s a template language used by Shopify to allow users to change their store and create outputs. It’s used in conjunction with Ruby and is available on the open-source platform GitHub for any curious enough to look. 

The language was first developed by Shopify CEO Tobias Lütke. It allows data to be displayed on Shopify in a template and is what allows people to change their store and enjoy Shopify themes. 

shopify template language

Originally meant for just Shopify, it is now used in many other content management systems and site generators. 

Is Liquid a programming language or a template?

Liquid is often referred to as a template, template language, template builder, or template engine. It can make it confusing to establish what exactly Liquid is. 

Well, Liquid works almost like a programming language. It has syntax, which is the rules that determine what the language symbols mean, just like other programming languages. 

CTA - your go to shopify partner

It runs on three main components:

  • Objects: objects represent all the data defined by the admin. It includes things like product names, product availability, coupon codes, etc. 
  • Tags: unlike objects, which create visible outputs you can see on your store, tags create conditions for outputs. For example, tags will be responsible for displaying sold-out messages when all your product has been bought by consumers. 
  • Filters: filters help manipulate output data, allow agnostic themes, and save time when a Shopify developer codes a new feature. It’s a very powerful part of Liquid and is used in conjunction with Liquid’s output. 

Liquid also has other concepts readily found in programming, like logic. 

So why the confusion?

Because beyond syntax and a few coding crossovers, Liquid differs slightly from other programming languages. Unlike other languages, which are very flexible, Liquid is limited. Not because it’s flawed but because it was designed that way. 

What uses does Liquid have?

shopify templating language

After all this talk about what Liquid is, you might find yourself wondering what exactly its function is. Why not just use another, already existing programming language? What is the point of having a limited programming language? 

Liquid is the middleman between your store data and the HTML of the web. It allows for easy access to variables within the template or Liquid folder. 

With template variables, it is possible to create store outputs without needing to know everything about the output data, and allows users to do this without having to do any intense technical work. 

This creates almost a one size fits all situation for Shopify stores and themes. Designers or developers can create loops and outputs without needing to know your store or your products. Themes can be applied to multiple stores and comfortably be used on all of them. 

Users can customize their themes, submit tasks to developers for custom features, and enjoy the same theme as another store but in a wildly different way. 

Which parts of your store is Liquid used for?

For content that stays the same across your store, like navigation and the footer, Shopify uses HTML. It’s the standard programming language used to display web content. 

what is liquid shopify

For content that changes or dynamic content, Shopify uses Liquid. This data is changed by the store owner through the theme editor or the admin dashboard and includes things like product price, quantity, and so forth. 

This data is collected when someone views your store and displayed it to them in real time. Every time a new product is loaded, current information is ‘fetched’ and displayed according to the information you provided when setting up your store and loading products. 

How to access your store’s Liquid Code

Now that you know what you need to about Liquid, let’s show you how to access your Liquid files. As a precaution, clone your Shopify store or make a Shopify site backup. This way any mistakes can be undone. 

Step 1: Log in 

Log in to your Shopify account with your unique login details. 

Step 2: Go to Edit Code

  • In your Shopify admin, navigate to the left sidebar and look for the Online Store section. Click on it. 
  • Under the Online Store section, scroll down until you find the Themes option and click on it. 
  • Next, you will be on a page with your current theme displayed. To the right of the theme, there will be a drop-down menu labeled Actions. Click on Actions
  • At the bottom of the drop-down menu will be the option to Edit Code. Click on it to access your stores code. 
what is liquid in shopify

Step 3: Edit Liquid code

On the new page, you will find a sidebar filled with folders. Each folder will have the .liquid extension. These are all your store’s Liquid codes. 

Every folder contains HTML and Liquid. Liquid code is easy to distinguish; it’s the code with double curly brackets {{ text }} or curly brackets and percentage symbols {%text%}. 

If you played around and made a mistake, use the upload Shopify files function to return your store to normal. 

What is Shopify Liquid? (FAQs)

Is Shopify Liquid hard to learn?

Liquid is relatively easy to learn. It’s easy to read, which makes it a great choice for beginners, and knowing even the most basic terms will have store owners gain a deeper understanding of how their store runs. 

Once you start to understand more technical jargon and the workings of Shopify, things like Shopify redirects, pending SSL, and Shopify and Google sitemaps will become easier to understand and resolve. 

Is coding required for Shopify? 

liquid coding shopify

No, coding is not required for Shopify. From the admin dashboard, you can control almost every aspect of your store with preset options. 

Coding is only useful if you really want to completely customize your store and even then, you can submit a task and have a developer or designer create custom features for you. One of the platform’s biggest selling points is how easy it is to use. Users don’t need to have any knowledge of code or programming to enjoy the full power of the platform. 

Conclusion

Though knowing what Shopify stores run on and exactly how it functions, users can troubleshoot issues, make informed choices when looking for technical help, and get the most from their store. 

Liquid is easy to understand and access. With all the free resources available online, it’s easy to familiarise yourself with the syntax. Gaining knowledge about something gives you control over it. The same rule applies to Shopify and Liquid.

Did you find our blog helpful? Then consider checking other guides:

Read more articles