Basics
Liquid Syntax
Liquid Syntax Basics
Liquid syntax uses {% %} for logic and {{ }} for output in Shopify themes.
Introduction to Liquid Syntax
Liquid is a template language created by Shopify and is used to load dynamic content on storefronts. It allows developers to embed logic into HTML and manipulate content depending on different conditions. This post will guide you through the basic syntax of Liquid, focusing on how to use tags for logic and output.
Logic Tags in Liquid
Logic tags in Liquid are enclosed within {% %}
. They are used to perform operations like loops, conditionals, and assigning variables. Let's explore some common logic tags.
Conditional Logic with 'if' and 'unless'
The if
and unless
tags are used for conditional operations. These are similar to if-else statements in many programming languages.
Iteration with 'for' Loops
The for
loop is used to iterate over an array. For example, you can loop through a list of products.
Output Tags in Liquid
Output tags in Liquid are enclosed within {{ }}
. These tags are used to print variables and expressions. Here's how you can display product information.
Filters in Liquid
Filters are used to modify the output of variables. They are placed within the output tags and separated by a pipe |
. For example, using the money
filter formats a number as a currency.
Conclusion
Liquid syntax is a powerful tool for developers working with Shopify themes. By mastering the use of logic and output tags, you can create dynamic and flexible e-commerce sites. In the next post, we will delve deeper into using variables in Liquid.