Control
-
IF
The
InputIF
statement is used to execute a block of code only if a certain condition is true.{% assign color = "red" -%} {% if {{color}} == "red" -%} <p>Red is the color.</p> {% endif -%}
OutputRed is the color.
-
IF ELSE
The
InputIF ELSE
statement is similar toIF
, only this statement gives you another possible choice.{% assign color = "blue" -%} {% if {{color}} == "red" -%} <p>Red is the color.</p> {% else -%} <p>The color is not red.</p> {% endif -%}
OutputThe color is not red.
You can also use the
InputIF ELSE
statement to check if a variable is blank or has no value. And to display specific content based on the value. For example:{% assign color = "blue" -%} {% if {{color}} == "null" -%} <p>Color has no value.</p> {% else -%} <p>Color has a value.</p> {% endif -%}
OutputThe Color has no value.
-
UNLESS
The
InputUNLESS
statement is used to execute a block of code only if a certain condition is NOT true.{% unless {{color}} == "red" -%} <p>Red is not the color.</p> {% endunless -%}
OutputRed is not the color.
-
CASE
The
InputCASE
statement is used for....{% case {{color}} -%} when "red" <p>Red is the color.</p> when "blue" <p>Blue is the color.</p> when "green" <p>Green is the color.</p> {% endcase -%}
OutputBlue is not the color.
Iteration
-
FOR
The
InputFOR
statement is used to loop through a collection of items to display.{% for item in collection.items -%} <p>Item Name: {{name}}</p> {% endfor -%}
OutputItem Name: Mark
-
CYCLE
The
InputCYCLE
statement is used to.....{% for item in collection.items -%} <p>Item Name: {{name}}</p> {% endfor -%}
OutputNOT ACTIVE
Include
-
INCLUDE
The
INCLUDE
statement is used to include an external HTML document onto a Web Page.For example to include a file named "to-be-included.htm", start by creating a file with the code you want insert into another Web Page.
Included File - "to-be-included.htm"<html> <head><head> <body> <h2>Include File</h2> <p>This content in included into a Web page using Liquid Include.</p> </body> </html>
Input{% include "/path-to-file/to-be-included.htm" -%}
Variable
-
ASSIGN
The
InputASSIGN
statement is used to assign (or update) a value to a variable. After which the data value in the assigned variable will be available to use.{% assign my-color = "purple" -%} {{my-color}}
Outputpurple
-
CAPTURE
The
InputCAPTURE
statement allows you to assign a block of text or HTML code to a variable.{% capture myName -%} <span style="color:blue">{{myName}}</span> {% endcapture -%}
After which the variable
Output{{myName}}
will be available to render the text or HMTL on a Web Page. The HTML code or text between theCAPTURE
tags does not render on the page.Mark
Comment
-
COMMENT
The
COMMENT
statement is used to comment out block of code or text. Commented code/text will not even appear in the Web Page's HTML. So the LiquidComment
is more powerful than the normal HTML comment<!-- content -->
.{% comment -%} <p> This block of code will not display.</p> {% endcomment -%}
Raw
-
RAW
The
RAW
tags disables tag processing for content with the tag.{% raw %} In Handlebars, {{this}} will be HTML-escaped and will render the text on the page. {% endraw %}
Comments
0 comments
Please sign in to leave a comment.