Liquid Operators logical and comparison operators in Shopify
Drive 20-40% of your revenue with Avada
Liquid is a widely recognized open-source project on GitHub and is used by many software projects, including content management systems and flat file site generators. Shopify uses Liquid as the foundation for its themes, enabling dynamic content on online store pages through tags, objects, and filters. However, Liquid has intentional limitations, such as the lack of a state concept, which restricts deep access to the platform’s internals. Although these limitations might seem restrictive to experienced programmers, they are carefully designed. Liquid operates based on five main elements: handles, operators, types, truthy and falsy values, and whitespace control. This article will delve into one of these basics—Liquid operators, focusing specifically on logical and comparison operators.
Liquid Operators: logical and comparison operators
Many logical and comparison operators has been accessed by liquid. Obviously, you can use operators to make up logic with control flow tags.
Logic {#1}
We can control the output to our template using a simple if, or endif statement. In many ways if statements are like questions.
A different piece of markup will be output depend on the answer to the question. There will be no mark up at all in some cases.
Another way of understanding the logic is that it enable us to control the flow of a template and ultimately make decisions on which data is shown. It is worth noting that unlike output tags the inclusion of logic tags in your templates does not result in anything being directly rendered, in addition, they enable us to control what is rendered exactly.
In Shopify theme development, you will find yourself using if statements a lot, below is an example of logic liquid:
This code illustrates how you can either show the number of items in a visitors cart or extract a link to your products.
Essential operators {#2}
There are 8 essential operators. The symbol and meaning of these operators are listed in table below:
| Symbol | Meaning |
|---|---|
| == | equals |
| != | does not equal |
| > | greater than |
| < | less than |
| >= | greater than or equal to |
| <= | less than or equal to |
| or | logical or |
| and | logical and |
Below is an example of the equal operator:
{% if customer.has_account == true %}
Welcome back to our store!
{% endif %}
You can combine many comparisons in a tag using the and and or operators, below is an example of combining two equal operators:
{% if product.type == "Shirt" or product.type == "Shoes" %}
This is a shirt or a shoe.
{% endif %}
Contains {#3}
contains test out for the existence of a substring inside a string.
{% if product.title contains 'Pack' %}
This product's title contains the word Pack.
{% endif %}
It also test out for the existence of a string in an array of strings.
{% if product.tags contains 'Hello' %}
This product has been tagged with 'Hello'.
{% endif %}
Finally, contains can only search strings. You are unable to use it to test out for an object in an array of objects.
Arrangement of operators {#4}
In tags with more than one and or or operator, operators are tested in order from right to left.
You are unable to change the order of operations using parentheses — parentheses are invalid characters in Liquid and will stop your tags from working.
Conclusion
We hope that this article will give you full information about the basic liquid in shopify and will be the foundation for you to practice other function in building your business page.
Liquid
