mirror of
https://github.com/Shopify/liquid.git
synced 2026-09-15 08:50:45 -07:00
Merge pull request #1147 from EricFromCanada/gh-pages-updates
Documentation fixes & improvements
This commit is contained in:
@@ -0,0 +1,12 @@
|
||||
# http://editorconfig.org/
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
end_of_line = lf
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
insert_final_newline = true
|
||||
|
||||
[*.md]
|
||||
trim_trailing_whitespace = true
|
||||
@@ -3,7 +3,6 @@
|
||||
To run, follow these steps:
|
||||
|
||||
1. Download ZIP or clone in GitHub
|
||||
2. Navigate to `liquid` folder
|
||||
3. Run `jekyll watch`
|
||||
4. Open `http://127.0.0.1:4000` in your browser
|
||||
|
||||
2. Navigate to `liquid-gh-pages` folder or checkout `gh-pages` branch
|
||||
3. Run `bundle exec jekyll serve`
|
||||
4. Open `http://127.0.0.1:4000/liquid/` in your browser
|
||||
|
||||
@@ -10,7 +10,6 @@ Liquid code can be categorized into [**objects**](#objects), [**tags**](#tags),
|
||||
|
||||
**Objects** tell Liquid where to show content on a page. Objects and variable names are denoted by double curly braces: `{% raw %}{{{% endraw %}` and `{% raw %}}}{% endraw %}`.
|
||||
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
@@ -20,7 +19,7 @@ Liquid code can be categorized into [**objects**](#objects), [**tags**](#tags),
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
Introduction
|
||||
{{ page.title }}
|
||||
```
|
||||
|
||||
In this case, Liquid is rendering the content of an object called `page.title`, and that object contains the text `Introduction`.
|
||||
@@ -47,13 +46,12 @@ Hello Adam!
|
||||
|
||||
Tags can be categorized into three types:
|
||||
|
||||
- [Control flow]({{ "/tags/control-flow" | prepend: site.baseurl }})
|
||||
- [Iteration]({{ "/tags/iteration" | prepend: site.baseurl }})
|
||||
- [Variable assignments]({{ "/tags/variable" | prepend: site.baseurl }})
|
||||
- [Control flow]({{ "/tags/control-flow/" | prepend: site.baseurl }})
|
||||
- [Iteration]({{ "/tags/iteration/" | prepend: site.baseurl }})
|
||||
- [Variable assignments]({{ "/tags/variable/" | prepend: site.baseurl }})
|
||||
|
||||
You can read more about each type of tag in their respective sections.
|
||||
|
||||
|
||||
## Filters
|
||||
|
||||
**Filters** change the output of a Liquid object. They are used within an output and are separated by a `|`.
|
||||
@@ -81,5 +79,5 @@ Multiple filters can be used on one output. They are applied from left to right.
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
Hello Adam!
|
||||
{{ "adam!" | capitalize | prepend: "Hello " }}
|
||||
```
|
||||
|
||||
@@ -70,7 +70,7 @@ You can use multiple operators in a tag:
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% if product.title contains 'Pack' %}
|
||||
{% if product.title contains "Pack" %}
|
||||
This product's title contains the word Pack.
|
||||
{% endif %}
|
||||
{% endraw %}
|
||||
@@ -80,8 +80,8 @@ You can use multiple operators in a tag:
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% if product.tags contains 'Hello' %}
|
||||
This product has been tagged with 'Hello'.
|
||||
{% if product.tags contains "Hello" %}
|
||||
This product has been tagged with "Hello".
|
||||
{% endif %}
|
||||
{% endraw %}
|
||||
```
|
||||
@@ -95,7 +95,7 @@ In tags with more than one `and` or `or` operator, operators are checked in orde
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% if true or false and false %}
|
||||
This evaluates to true, since the 'and' condition is checked first.
|
||||
This evaluates to true, since the `and` condition is checked first.
|
||||
{% endif %}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
+3
-5
@@ -49,7 +49,7 @@ Booleans are either `true` or `false`. No quotations are necessary when declarin
|
||||
|
||||
Nil is a special empty value that is returned when Liquid code has no results. It is **not** a string with the characters "nil".
|
||||
|
||||
Nil is [treated as false]({{ "/basics/truthy-and-falsy" | prepend: site.baseurl }}) in the conditions of `if` blocks and other Liquid tags that check the truthfulness of a statement.
|
||||
Nil is [treated as false]({{ "/basics/truthy-and-falsy/#falsy" | prepend: site.baseurl }}) in the conditions of `if` blocks and other Liquid tags that check the truthfulness of a statement.
|
||||
|
||||
In the following example, if the user does not exist (that is, `user` returns `nil`), Liquid will not print the greeting:
|
||||
|
||||
@@ -81,7 +81,7 @@ Arrays hold lists of variables of any type.
|
||||
|
||||
### Accessing items in arrays
|
||||
|
||||
To access all the items in an array, you can loop through each item in the array using an [iteration tag]({{ "/tags/iteration" | prepend: site.baseurl }}).
|
||||
To access all the items in an array, you can loop through each item in the array using an [iteration tag]({{ "/tags/iteration/" | prepend: site.baseurl }}).
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -95,9 +95,7 @@ To access all the items in an array, you can loop through each item in the array
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
{% raw %}
|
||||
Tobi Laura Tetsuro Adam
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
### Accessing specific items in arrays
|
||||
@@ -125,4 +123,4 @@ Adam
|
||||
|
||||
You cannot initialize arrays using only Liquid.
|
||||
|
||||
You can, however, use the [split]({{ "/filters/split" | prepend: site.baseurl }}) filter to break a string into an array of substrings.
|
||||
You can, however, use the [split]({{ "/filters/split/" | prepend: site.baseurl }}) filter to break a string into an array of substrings.
|
||||
|
||||
@@ -21,4 +21,4 @@ Jekyll also powers [GitHub Pages](https://pages.github.com/), a web hosting serv
|
||||
|
||||
Jekyll might not be using the latest version of Liquid. This means that the tags and filters listed on this site may not work in Jekyll. Often the Jekyll project will wait for a stable release of Liquid rather than using a beta or release candidate version. To see what version of Liquid Jekyll is using, check the **runtime dependencies** section of [Jekyll's gem page](https://rubygems.org/gems/jekyll).
|
||||
|
||||
Jekyll's version of Liquid is documented in the [Templates section of Jekyll's documentation](http://jekyllrb.com/docs/templates/). If you want to try out Jekyll's version of Liquid, you can clone the Jekyll project or install Jekyll as a gem and test Liquid on a static site.
|
||||
Jekyll's version of Liquid is documented in the [Liquid section of Jekyll's documentation](https://jekyllrb.com/docs/liquid/). If you want to try out Jekyll's version of Liquid, you can clone the Jekyll project or install Jekyll as a gem and test Liquid on a static site.
|
||||
|
||||
+14
-14
@@ -5,20 +5,20 @@ description: An overview of controlling whitespace between code in the Liquid te
|
||||
|
||||
In Liquid, you can include a hyphen in your tag syntax `{% raw %}{{-{% endraw %}`, `{% raw %}-}}{% endraw %}`, `{% raw %}{%-{% endraw %}`, and `{% raw %}-%}{% endraw %}` to strip whitespace from the left or right side of a rendered tag.
|
||||
|
||||
Normally, even if it doesn't output text, any line of Liquid in your template will still output a blank line in your rendered HTML:
|
||||
Normally, even if it doesn't print text, any line of Liquid in your template will still print a blank line in your rendered HTML:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{% assign my_variable = "tomato" %}
|
||||
{{ my_variable }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
Notice the blank line before "tomato" in the rendered template:
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{% assign my_variable = "tomato" %}
|
||||
{{ my_variable }}
|
||||
```
|
||||
@@ -26,34 +26,34 @@ Notice the blank line before "tomato" in the rendered template:
|
||||
By including hyphens in your `assign` tag, you can strip the generated whitespace from the rendered template:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{%- assign my_variable = "tomato" -%}
|
||||
{{ my_variable }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
tomato
|
||||
```
|
||||
|
||||
If you don't want any of your tags to output whitespace, as a general rule you can add hyphens to both sides of all your tags (`{% raw %}{%-{% endraw %}` and `{% raw %}-%}{% endraw %}`):
|
||||
If you don't want any of your tags to print whitespace, as a general rule you can add hyphens to both sides of all your tags (`{% raw %}{%-{% endraw %}` and `{% raw %}-%}{% endraw %}`):
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{% assign username = "John G. Chalmers-Smith" %}
|
||||
{% if username and username.size > 10 %}
|
||||
Wow, {{ username }}, you have a long name!
|
||||
{% else %}
|
||||
Hello there!
|
||||
{% endif %}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output without whitespace control</p>
|
||||
``` text
|
||||
```text
|
||||
{% assign username = "John G. Chalmers-Smith" %}
|
||||
{% if username and username.size > 10 %}
|
||||
Wow, {{ username }}, you have a long name!
|
||||
@@ -63,18 +63,18 @@ If you don't want any of your tags to output whitespace, as a general rule you c
|
||||
```
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{%- assign username = "John G. Chalmers-Smith" -%}
|
||||
{%- if username and username.size > 10 -%}
|
||||
Wow, {{ username }}, you have a long name!
|
||||
{%- else -%}
|
||||
Hello there!
|
||||
{%- endif -%}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output with whitespace control</p>
|
||||
``` text
|
||||
```text
|
||||
Wow, John G. Chalmers-Smith, you have a long name!
|
||||
```
|
||||
|
||||
+5
-5
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: abs
|
||||
description: Liquid filter that gets the absolute value of a number.
|
||||
description: Liquid filter that returns the absolute value of a number.
|
||||
redirect_from: /filters/
|
||||
---
|
||||
|
||||
@@ -15,7 +15,7 @@ Returns the absolute value of a number.
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
17
|
||||
{{ -17 | abs }}
|
||||
```
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
@@ -27,10 +27,10 @@ Returns the absolute value of a number.
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
4
|
||||
{{ 4 | abs }}
|
||||
```
|
||||
|
||||
`abs` will also work on a string if the string only contains a number.
|
||||
`abs` will also work on a string that only contains a number:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -41,5 +41,5 @@ Returns the absolute value of a number.
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
19.86
|
||||
{{ "-19.86" | abs }}
|
||||
```
|
||||
|
||||
@@ -1,30 +1,30 @@
|
||||
---
|
||||
title: at_least
|
||||
description: Liquid filter that limits a number to a minimum value
|
||||
description: Liquid filter that limits a number to a minimum value.
|
||||
---
|
||||
|
||||
Limits a number to a minimum value.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
{{ 4 | at_least: 5 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```
|
||||
```text
|
||||
5
|
||||
```
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
{{ 4 | at_least: 3 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```
|
||||
```text
|
||||
4
|
||||
```
|
||||
|
||||
+7
-7
@@ -1,30 +1,30 @@
|
||||
---
|
||||
title: at_most
|
||||
description: Liquid filter that limits a number to a maximum value
|
||||
description: Liquid filter that limits a number to a maximum value.
|
||||
---
|
||||
|
||||
Limits a number to a maximum value.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
{{ 4 | at_most: 5 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```
|
||||
```text
|
||||
4
|
||||
```
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
{{ 4 | at_most: 3 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```
|
||||
```text
|
||||
3
|
||||
```
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: capitalize
|
||||
description: Liquid filter that capitalizes the first character in a string.
|
||||
description: Liquid filter that capitalizes the first character of a string.
|
||||
---
|
||||
|
||||
Makes the first character of a string capitalized.
|
||||
@@ -14,10 +14,10 @@ Makes the first character of a string capitalized.
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
Title
|
||||
{{ "title" | capitalize }}
|
||||
```
|
||||
|
||||
`capitalize` only capitalizes the first character of the string, so later words are not affected:
|
||||
`capitalize` only capitalizes the first character of a string, so later words are not affected:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -28,5 +28,5 @@ Title
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
My great title
|
||||
{{ "my great title" | capitalize }}
|
||||
```
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: ceil
|
||||
description: Liquid filter that gets the ceiling of a number by rounding up to the nearest integer.
|
||||
description: Liquid filter that returns the ceiling of a number by rounding up to the nearest integer.
|
||||
---
|
||||
|
||||
Rounds the input up to the nearest whole number. Liquid tries to convert the input to a number before the filter is applied.
|
||||
|
||||
+20
-21
@@ -7,47 +7,46 @@ Removes any `nil` values from an array.
|
||||
|
||||
For this example, assume `site.pages` is an array of content pages for a website, and some of these pages have an attribute called `category` that specifies their content category. If we `map` those categories to an array, some of the array items might be `nil` if any pages do not have a `category` attribute.
|
||||
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% assign site_categories = site.pages | map: 'category' %}
|
||||
{% raw %}
|
||||
{% assign site_categories = site.pages | map: "category" %}
|
||||
|
||||
{% for category in site_categories %}
|
||||
{{ category }}
|
||||
- {{ category }}
|
||||
{% endfor %}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
business
|
||||
celebrities
|
||||
|
||||
lifestyle
|
||||
sports
|
||||
|
||||
technology
|
||||
- business
|
||||
- celebrities
|
||||
-
|
||||
- lifestyle
|
||||
- sports
|
||||
-
|
||||
- technology
|
||||
```
|
||||
|
||||
By using `compact` when we create our `site_categories` array, we can remove all the `nil` values in the array.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% assign site_categories = site.pages | map: 'category' | compact %}
|
||||
{% raw %}
|
||||
{% assign site_categories = site.pages | map: "category" | compact %}
|
||||
|
||||
{% for category in site_categories %}
|
||||
{{ category }}
|
||||
- {{ category }}
|
||||
{% endfor %}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
business
|
||||
celebrities
|
||||
lifestyle
|
||||
sports
|
||||
technology
|
||||
- business
|
||||
- celebrities
|
||||
- lifestyle
|
||||
- sports
|
||||
- technology
|
||||
```
|
||||
|
||||
+4
-4
@@ -6,8 +6,8 @@ description: Liquid filter that concatenates arrays.
|
||||
Concatenates (joins together) multiple arrays. The resulting array contains all the items from the input arrays.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign fruits = "apples, oranges, peaches" | split: ", " %}
|
||||
{% assign vegetables = "carrots, turnips, potatoes" | split: ", " %}
|
||||
|
||||
@@ -16,8 +16,8 @@ Concatenates (joins together) multiple arrays. The resulting array contains all
|
||||
{% for item in everything %}
|
||||
- {{ item }}
|
||||
{% endfor %}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
@@ -32,8 +32,8 @@ Concatenates (joins together) multiple arrays. The resulting array contains all
|
||||
You can string together `concat` filters to join more than two arrays:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign furniture = "chairs, tables, shelves" | split: ", " %}
|
||||
|
||||
{% assign everything = fruits | concat: vegetables | concat: furniture %}
|
||||
@@ -41,8 +41,8 @@ You can string together `concat` filters to join more than two arrays:
|
||||
{% for item in everything %}
|
||||
- {{ item }}
|
||||
{% endfor %}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
|
||||
+21
-21
@@ -3,31 +3,31 @@ title: divided_by
|
||||
description: Liquid filter that divides a number by another number.
|
||||
---
|
||||
|
||||
Divides a number by the specified number.
|
||||
Divides a number by another number.
|
||||
|
||||
The result is rounded down to the nearest integer (that is, the [floor]({{ site.baseurl }}/filters/floor)) if the divisor is an integer.
|
||||
The result is rounded down to the nearest integer (that is, the [floor]({{ "/filters/floor/" | prepend: site.baseurl }})) if the divisor is an integer.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ 16 | divided_by: 4 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ 16 | divided_by: 4 }}
|
||||
```
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ 5 | divided_by: 3 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ 5 | divided_by: 3 }}
|
||||
```
|
||||
|
||||
@@ -38,28 +38,28 @@ The result is rounded down to the nearest integer (that is, the [floor]({{ site.
|
||||
For example, here the divisor is an integer:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ 20 | divided_by: 7 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ 20 | divided_by: 7 }}
|
||||
```
|
||||
|
||||
Here it is a float:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ 20 | divided_by: 7.0 }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ 20 | divided_by: 7.0 }}
|
||||
```
|
||||
|
||||
@@ -70,32 +70,32 @@ You might want to use a variable as a divisor, in which case you can't simply ad
|
||||
In this example, we're dividing by a variable that contains an integer, so we get an integer:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{% assign my_integer = 7 %}
|
||||
{{ 20 | divided_by: my_integer }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{% assign my_integer = 7 %}
|
||||
{{ 20 | divided_by: my_integer }}
|
||||
```
|
||||
|
||||
Here, we [multiply]({{ site.baseurl}}/filters/times) the variable by `1.0` to get a float, then divide by the float instead:
|
||||
Here, we [multiply]({{ "/filters/times/" | prepend: site.baseurl }}) the variable by `1.0` to get a float, then divide by the float instead:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{% assign my_integer = 7 %}
|
||||
{% assign my_float = my_integer | times: 1.0 %}
|
||||
{{ 20 | divided_by: my_float }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{% assign my_integer = 7 %}
|
||||
{% assign my_float = my_integer | times: 1.0 %}
|
||||
{{ 20 | divided_by: my_float }}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: downcase
|
||||
description: Liquid filter that coverts a string to lowercase.
|
||||
description: Liquid filter that converts a string to lowercase.
|
||||
---
|
||||
|
||||
Makes each character in a string lowercase. It has no effect on strings which are already all lowercase.
|
||||
|
||||
+3
-7
@@ -8,17 +8,13 @@ Returns the first item of an array.
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}
|
||||
|
||||
{{ my_array.first }}
|
||||
{{ "Ground control to Major Tom." | split: " " | first }}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}
|
||||
|
||||
{{ my_array.first }}
|
||||
{{ "Ground control to Major Tom." | split: " " | first }}
|
||||
```
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
@@ -37,7 +33,7 @@ Returns the first item of an array.
|
||||
{{ my_array.first }}
|
||||
```
|
||||
|
||||
You can use `first` with dot notation when you need to use the filter inside a tag.
|
||||
You can use `first` with dot notation when you need to use the filter inside a tag:
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
|
||||
+2
-2
@@ -1,9 +1,9 @@
|
||||
---
|
||||
title: floor
|
||||
description: Liquid filter that gets the floor of a number by rounding down to the nearest integer.
|
||||
description: Liquid filter that returns the floor of a number by rounding down to the nearest integer.
|
||||
---
|
||||
|
||||
Rounds a number down to the nearest whole number. Liquid tries to convert the input to a number before the filter is applied.
|
||||
Rounds the input down to the nearest whole number. Liquid tries to convert the input to a number before the filter is applied.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+4
-8
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: last
|
||||
description: Liquid filter that gets the last value in an array.
|
||||
description: Liquid filter that returns the last item of an array.
|
||||
---
|
||||
|
||||
Returns the last item of an array.
|
||||
@@ -8,17 +8,13 @@ Returns the last item of an array.
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}
|
||||
|
||||
{{ my_array.last }}
|
||||
{{ "Ground control to Major Tom." | split: " " | last }}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}
|
||||
|
||||
{{ my_array.last }}
|
||||
{{ "Ground control to Major Tom." | split: " " | last }}
|
||||
```
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
@@ -37,7 +33,7 @@ Returns the last item of an array.
|
||||
{{ my_array.last }}
|
||||
```
|
||||
|
||||
You can use `last` with dot notation when you need to use the filter inside a tag.
|
||||
You can use `last` with dot notation when you need to use the filter inside a tag:
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
|
||||
+2
-2
@@ -1,9 +1,9 @@
|
||||
---
|
||||
title: lstrip
|
||||
description: Liquid filter that removes whitespace from the left side of a string.
|
||||
description: Liquid filter that removes all whitespace from the left side of a string.
|
||||
---
|
||||
|
||||
Removes all whitespaces (tabs, spaces, and newlines) from the beginning of a string. The filter does not affect spaces between words.
|
||||
Removes all whitespace (tabs, spaces, and newlines) from the left side of a string. It does not affect spaces between words.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+6
-6
@@ -13,16 +13,16 @@ In this example, assume the object `site.pages` contains all the metadata for a
|
||||
{% assign all_categories = site.pages | map: "category" %}
|
||||
|
||||
{% for item in all_categories %}
|
||||
{{ item }}
|
||||
- {{ item }}
|
||||
{% endfor %}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
business
|
||||
celebrities
|
||||
lifestyle
|
||||
sports
|
||||
technology
|
||||
- business
|
||||
- celebrities
|
||||
- lifestyle
|
||||
- sports
|
||||
- technology
|
||||
```
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: minus
|
||||
description: Liquid filter that subtracts one number from another.
|
||||
description: Liquid filter that subtracts one number from another number.
|
||||
---
|
||||
|
||||
Subtracts a number from another number.
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: modulo
|
||||
description: Liquid filter that returns the remainder from a division operation.
|
||||
description: Liquid filter that returns the remainder of a division operation.
|
||||
---
|
||||
|
||||
Returns the remainder of a division operation.
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
---
|
||||
title: newline_to_br
|
||||
description: Liquid filter that converts newlines in an input string to HTML <br> tags.
|
||||
description: Liquid filter that converts newlines in a string to HTML <br /> tags.
|
||||
---
|
||||
|
||||
Replaces every newline (`\n`) with an HTML line break (`<br>`).
|
||||
Replaces every newline (`\n`) in a string with an HTML line break (`<br />`).
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: plus
|
||||
description: Liquid filter that adds a number to another number.
|
||||
description: Liquid filter that adds one number to another number.
|
||||
---
|
||||
|
||||
Adds a number to another number.
|
||||
|
||||
+1
-3
@@ -17,13 +17,12 @@ Adds the specified string to the beginning of another string.
|
||||
{{ "apples, oranges, and bananas" | prepend: "Some fruit: " }}
|
||||
```
|
||||
|
||||
You can also `prepend` variables:
|
||||
`prepend` can also be used with variables:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign url = "example.com" %}
|
||||
|
||||
{{ "/index.html" | prepend: url }}
|
||||
{% endraw %}
|
||||
```
|
||||
@@ -31,6 +30,5 @@ You can also `prepend` variables:
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
{% assign url = "example.com" %}
|
||||
|
||||
{{ "/index.html" | prepend: url }}
|
||||
```
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@ title: replace
|
||||
description: Liquid filter that replaces all occurences of a given substring in a string.
|
||||
---
|
||||
|
||||
Replaces every occurrence of an argument in a string with the second argument.
|
||||
Replaces every occurrence of the first argument in a string with the second argument.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
@@ -8,13 +8,11 @@ Replaces only the first occurrence of the first argument in a string with the se
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign my_string = "Take my protein pills and put my helmet on" %}
|
||||
{{ my_string | replace_first: "my", "your" }}
|
||||
{{ "Take my protein pills and put my helmet on" | replace_first: "my", "your" }}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
{% assign my_string = "Take my protein pills and put my helmet on" %}
|
||||
{{ my_string | replace_first: "my", "your" }}
|
||||
{{ "Take my protein pills and put my helmet on" | replace_first: "my", "your" }}
|
||||
```
|
||||
|
||||
+1
-1
@@ -21,7 +21,7 @@ Reverses the order of the items in an array. `reverse` cannot reverse a string.
|
||||
{{ my_array | reverse | join: ", " }}
|
||||
```
|
||||
|
||||
`reverse` cannot be used directly on a string, but you can split a string into an array, reverse the array, and rejoin it by chaining together filters:
|
||||
Although `reverse` cannot be used directly on a string, you can split a string into an array, reverse the array, and rejoin it by chaining together filters:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@ title: round
|
||||
description: Liquid filter that rounds a number to the nearest integer.
|
||||
---
|
||||
|
||||
Rounds an input number to the nearest integer or, if a number is specified as an argument, to that number of decimal places.
|
||||
Rounds a number to the nearest integer or, if a number is passed as an argument, to that number of decimal places.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@ title: rstrip
|
||||
description: Liquid filter that removes all whitespace from the right side of a string.
|
||||
---
|
||||
|
||||
Removes all whitespace (tabs, spaces, and newlines) from the right side of a string.
|
||||
Removes all whitespace (tabs, spaces, and newlines) from the right side of a string. It does not affect spaces between words.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+3
-3
@@ -22,7 +22,7 @@ Returns the number of characters in a string or the number of items in an array.
|
||||
{% raw %}
|
||||
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}
|
||||
|
||||
{{ my_array | size }}
|
||||
{{ my_array.size }}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
@@ -30,10 +30,10 @@ Returns the number of characters in a string or the number of items in an array.
|
||||
```text
|
||||
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}
|
||||
|
||||
{{ my_array | size }}
|
||||
{{ my_array.size }}
|
||||
```
|
||||
|
||||
You can use `size` with dot notation when you need to use the filter inside a tag.
|
||||
You can use `size` with dot notation when you need to use the filter inside a tag:
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
|
||||
+2
-2
@@ -3,7 +3,7 @@ title: slice
|
||||
description: Liquid filter that returns a substring from a given position in a string.
|
||||
---
|
||||
|
||||
Returns a substring of 1 character beginning at the index specified by the argument passed in. An optional second argument specifies the length of the substring to be returned.
|
||||
Returns a substring of 1 character beginning at the index specified by the first argument. An optional second argument specifies the length of the substring to be returned.
|
||||
|
||||
String indices are numbered starting from 0.
|
||||
|
||||
@@ -43,7 +43,7 @@ String indices are numbered starting from 0.
|
||||
{{ "Liquid" | slice: 2, 5 }}
|
||||
```
|
||||
|
||||
If the first parameter is a negative number, the indices are counted from the end of the string:
|
||||
If the first argument is a negative number, the indices are counted from the end of the string:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+1
-1
@@ -21,7 +21,7 @@ Sorts items in an array in case-sensitive order.
|
||||
{{ my_array | sort | join: ", " }}
|
||||
```
|
||||
|
||||
An optional parameter specifies which property of the array's items to use for sorting.
|
||||
An optional argument specifies which property of the array's items to use for sorting.
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
|
||||
@@ -21,7 +21,7 @@ Sorts items in an array in case-insensitive order.
|
||||
{{ my_array | sort_natural | join: ", " }}
|
||||
```
|
||||
|
||||
An optional parameter specifies which property of the array's items to use for sorting.
|
||||
An optional argument specifies which property of the array's items to use for sorting.
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@ title: split
|
||||
description: Liquid filter that splits a string into an array using separators.
|
||||
---
|
||||
|
||||
Divides an input string into an array using the argument as a separator. `split` is commonly used to convert comma-separated items from a string to an array.
|
||||
Divides a string into an array using the argument as a separator. `split` is commonly used to convert comma-separated items from a string to an array.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+2
-2
@@ -1,9 +1,9 @@
|
||||
---
|
||||
title: strip
|
||||
description: Liquid filter that removes whitespace from the left and right sides of a string.
|
||||
description: Liquid filter that removes all whitespace from the left and right sides of a string.
|
||||
---
|
||||
|
||||
Removes all whitespace (tabs, spaces, and newlines) from both the left and right side of a string. It does not affect spaces between words.
|
||||
Removes all whitespace (tabs, spaces, and newlines) from both the left and right sides of a string. It does not affect spaces between words.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
|
||||
+10
-10
@@ -3,7 +3,7 @@ title: truncate
|
||||
description: Liquid filter that truncates a string to a given number of characters.
|
||||
---
|
||||
|
||||
`truncate` shortens a string down to the number of characters passed as a parameter. If the number of characters specified is less than the length of the string, an ellipsis (...) is appended to the string and is included in the character count.
|
||||
Shortens a string down to the number of characters passed as an argument. If the specified number of characters is less than the length of the string, an ellipsis (...) is appended to the string and is included in the character count.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -19,34 +19,34 @@ description: Liquid filter that truncates a string to a given number of characte
|
||||
|
||||
### Custom ellipsis
|
||||
|
||||
`truncate` takes an optional second parameter that specifies the sequence of characters to be appended to the truncated string. By default this is an ellipsis (...), but you can specify a different sequence.
|
||||
`truncate` takes an optional second argument that specifies the sequence of characters to be appended to the truncated string. By default this is an ellipsis (...), but you can specify a different sequence.
|
||||
|
||||
The length of the second parameter counts against the number of characters specified by the first parameter. For example, if you want to truncate a string to exactly 10 characters, and use a 3-character ellipsis, use **13** for the first parameter of `truncate`, since the ellipsis counts as 3 characters.
|
||||
The length of the second argument counts against the number of characters specified by the first argument. For example, if you want to truncate a string to exactly 10 characters, and use a 3-character ellipsis, use **13** for the first argument of `truncate`, since the ellipsis counts as 3 characters.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ "Ground control to Major Tom." | truncate: 25, ", and so on" }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ "Ground control to Major Tom." | truncate: 25, ", and so on" }}
|
||||
```
|
||||
|
||||
### No ellipsis
|
||||
|
||||
You can truncate to the exact number of characters specified by the first parameter and show no trailing characters by passing a blank string as the second parameter:
|
||||
You can truncate to the exact number of characters specified by the first argument and avoid showing trailing characters by passing a blank string as the second argument:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ "Ground control to Major Tom." | truncate: 20, "" }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ "Ground control to Major Tom." | truncate: 20, "" }}
|
||||
```
|
||||
|
||||
+10
-10
@@ -1,9 +1,9 @@
|
||||
---
|
||||
title: truncatewords
|
||||
description: Liquid filter that truncates a string to the given number of words.
|
||||
description: Liquid filter that truncates a string to a given number of words.
|
||||
---
|
||||
|
||||
Shortens a string down to the number of words passed as the argument. If the specified number of words is less than the number of words in the string, an ellipsis (...) is appended to the string.
|
||||
Shortens a string down to the number of words passed as an argument. If the specified number of words is less than the number of words in the string, an ellipsis (...) is appended to the string.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -19,32 +19,32 @@ Shortens a string down to the number of words passed as the argument. If the spe
|
||||
|
||||
### Custom ellipsis
|
||||
|
||||
`truncatewords` takes an optional second parameter that specifies the sequence of characters to be appended to the truncated string. By default this is an ellipsis (...), but you can specify a different sequence.
|
||||
`truncatewords` takes an optional second argument that specifies the sequence of characters to be appended to the truncated string. By default this is an ellipsis (...), but you can specify a different sequence.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ "Ground control to Major Tom." | truncatewords: 3, "--" }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ "Ground control to Major Tom." | truncatewords: 3, "--" }}
|
||||
```
|
||||
|
||||
### No ellipsis
|
||||
|
||||
You can avoid showing trailing characters by passing a blank string as the second parameter:
|
||||
You can avoid showing trailing characters by passing a blank string as the second argument:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
``` liquid
|
||||
{{ "Ground control to Major Tom." | truncatewords: 3, "" }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
``` text
|
||||
```text
|
||||
{{ "Ground control to Major Tom." | truncatewords: 3, "" }}
|
||||
```
|
||||
|
||||
+1
-1
@@ -1,6 +1,6 @@
|
||||
---
|
||||
title: upcase
|
||||
description: Liquid filter that capitalizes every character in a string.
|
||||
description: Liquid filter that converts a string to uppercase.
|
||||
---
|
||||
|
||||
Makes each character in a string uppercase. It has no effect on strings which are already all uppercase.
|
||||
|
||||
@@ -3,7 +3,7 @@ title: url_decode
|
||||
description: Liquid filter that decodes percent-encoded characters in a string.
|
||||
---
|
||||
|
||||
Decodes a string that has been encoded as a URL or by [`url_encode`]({{ '/filters/url_encode' | prepend: site.baseurl }}).
|
||||
Decodes a string that has been encoded as a URL or by [url_encode]({{ "/filters/url_encode/" | prepend: site.baseurl }}).
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -14,5 +14,5 @@ Decodes a string that has been encoded as a URL or by [`url_encode`]({{ '/filter
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
'Stop!' said Fred
|
||||
{{ "%27Stop%21%27+said+Fred" | url_decode }}
|
||||
```
|
||||
|
||||
+12
-17
@@ -3,26 +3,26 @@ title: where
|
||||
description: Liquid filter that selects from arrays.
|
||||
---
|
||||
|
||||
Creates an array including only the objects with a given property value, or any [truthy]({{ "/basics/truthy-and-falsy#truthy" | prepend: site.baseurl }}) value by default.
|
||||
Creates an array including only the objects with a given property value, or any [truthy]({{ "/basics/truthy-and-falsy/#truthy" | prepend: site.baseurl }}) value by default.
|
||||
|
||||
In this example, assume you have a list of products and you want to show your kitchen products separately. Using `where`, you can create an array containing only the products that have a `"type"` of `"kitchen"`.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
All products:
|
||||
{% for product in products %}
|
||||
- {{ product.title }}
|
||||
{% endfor %}
|
||||
{% endfor %}
|
||||
|
||||
{% assign kitchen_products = products | where: "type", "kitchen" %}
|
||||
|
||||
Kitchen products:
|
||||
{% for product in kitchen_products %}
|
||||
- {{ product.title }}
|
||||
{% endfor %}
|
||||
```
|
||||
{% endfor %}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
@@ -35,31 +35,28 @@ All products:
|
||||
Kitchen products:
|
||||
- Spatula
|
||||
- Garlic press
|
||||
|
||||
```
|
||||
|
||||
Say instead you have a list of products and you only want to show those that are available to buy. You can `where` with a property name but no target value to include all products with a [truthy]({{ "/basics/truthy-and-falsy#truthy" | prepend: site.baseurl }}) `"available"` value.
|
||||
Say instead you have a list of products and you only want to show those that are available to buy. You can `where` with a property name but no target value to include all products with a [truthy]({{ "/basics/truthy-and-falsy/#truthy" | prepend: site.baseurl }}) `"available"` value.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
All products:
|
||||
{% for product in products %}
|
||||
{% for product in products %}
|
||||
- {{ product.title }}
|
||||
{% endfor %}
|
||||
|
||||
{% assign available_products = products | where: "available" %}
|
||||
|
||||
Available products:
|
||||
{% for product in available_products %}
|
||||
{% for product in available_products %}
|
||||
- {{ product.title }}
|
||||
{% endfor %}
|
||||
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
|
||||
```text
|
||||
All products:
|
||||
- Coffee mug
|
||||
@@ -69,20 +66,18 @@ All products:
|
||||
Available products:
|
||||
- Coffee mug
|
||||
- Boring sneakers
|
||||
|
||||
```
|
||||
|
||||
|
||||
The `where` filter can also be used to find a single object in an array when combined with the `first` filter. For example, say you want to show off the shirt in your new fall collection.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
{% raw %}
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign new_shirt = products | where: "type", "shirt" | first %}
|
||||
|
||||
Featured product: {{ new_shirt.title }}
|
||||
```
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
|
||||
+1
-1
@@ -4,7 +4,7 @@ description: An overview of comments tags in the Liquid template language.
|
||||
---
|
||||
|
||||
Allows you to leave un-rendered code inside a Liquid template. Any text within
|
||||
the opening and closing `comment` blocks will not be output, and any Liquid code
|
||||
the opening and closing `comment` blocks will not be printed, and any Liquid code
|
||||
within will not be executed.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
|
||||
@@ -13,7 +13,7 @@ Executes a block of code only if a certain condition is `true`.
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% if product.title == 'Awesome Shoes' %}
|
||||
{% if product.title == "Awesome Shoes" %}
|
||||
These shoes are awesome!
|
||||
{% endif %}
|
||||
{% endraw %}
|
||||
@@ -31,7 +31,7 @@ The opposite of `if` – executes a block of code only if a certain condition is
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% unless product.title == 'Awesome Shoes' %}
|
||||
{% unless product.title == "Awesome Shoes" %}
|
||||
These shoes are not awesome.
|
||||
{% endunless %}
|
||||
{% endraw %}
|
||||
@@ -46,7 +46,7 @@ This would be the equivalent of doing the following:
|
||||
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% if product.title != 'Awesome Shoes' %}
|
||||
{% if product.title != "Awesome Shoes" %}
|
||||
These shoes are not awesome.
|
||||
{% endif %}
|
||||
{% endraw %}
|
||||
@@ -59,10 +59,10 @@ Adds more conditions within an `if` or `unless` block.
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
<!-- If customer.name = 'anonymous' -->
|
||||
{% if customer.name == 'kevin' %}
|
||||
<!-- If customer.name = "anonymous" -->
|
||||
{% if customer.name == "kevin" %}
|
||||
Hey Kevin!
|
||||
{% elsif customer.name == 'anonymous' %}
|
||||
{% elsif customer.name == "anonymous" %}
|
||||
Hey Anonymous!
|
||||
{% else %}
|
||||
Hi Stranger!
|
||||
@@ -82,11 +82,11 @@ Creates a switch statement to compare a variable with different values. `case` i
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign handle = 'cake' %}
|
||||
{% assign handle = "cake" %}
|
||||
{% case handle %}
|
||||
{% when 'cake' %}
|
||||
{% when "cake" %}
|
||||
This is a cake
|
||||
{% when 'cookie' %}
|
||||
{% when "cookie" %}
|
||||
This is a cookie
|
||||
{% else %}
|
||||
This is not a cake nor a cookie
|
||||
|
||||
+32
-14
@@ -1,20 +1,20 @@
|
||||
---
|
||||
title: Iteration
|
||||
description: An overview of iteration or 'loop' tags in the Liquid template language.
|
||||
description: An overview of iteration or "loop" tags in the Liquid template language.
|
||||
---
|
||||
|
||||
Iteration tags run blocks of code repeatedly.
|
||||
|
||||
## for
|
||||
|
||||
Repeatedly executes a block of code. For a full list of attributes available within a `for` loop, see [forloop (object)](https://docs.shopify.com/themes/liquid/objects/for-loops).
|
||||
Repeatedly executes a block of code. For a full list of attributes available within a `for` loop, see [forloop (object)](https://help.shopify.com/themes/liquid/objects/for-loops).
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% for product in collection.products %}
|
||||
{{ product.title }}
|
||||
{% endfor %}
|
||||
{% for product in collection.products %}
|
||||
{{ product.title }}
|
||||
{% endfor %}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
@@ -153,7 +153,7 @@ Defines a range of numbers to loop through. The range can be defined by both lit
|
||||
|
||||
### reversed
|
||||
|
||||
Reverses the order of the loop. Note that the flag’s spelling is different to the filter `reverse`.
|
||||
Reverses the order of the loop. Note that this flag's spelling is different from the filter `reverse`.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -172,17 +172,17 @@ Reverses the order of the loop. Note that the flag’s spelling is different to
|
||||
|
||||
## cycle
|
||||
|
||||
Loops through a group of strings and outputs them in the order that they were passed as parameters. Each time `cycle` is called, the next string that was passed as a parameter is output.
|
||||
Loops through a group of strings and prints them in the order that they were passed as arguments. Each time `cycle` is called, the next string argument is printed.
|
||||
|
||||
`cycle` must be used within a [for](#for) loop block.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% cycle 'one', 'two', 'three' %}
|
||||
{% cycle 'one', 'two', 'three' %}
|
||||
{% cycle 'one', 'two', 'three' %}
|
||||
{% cycle 'one', 'two', 'three' %}
|
||||
{% cycle "one", "two", "three" %}
|
||||
{% cycle "one", "two", "three" %}
|
||||
{% cycle "one", "two", "three" %}
|
||||
{% cycle "one", "two", "three" %}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
@@ -196,12 +196,30 @@ one
|
||||
|
||||
Uses for `cycle` include:
|
||||
|
||||
- applying odd/even classes to rows in a table
|
||||
- applying a unique class to the last product thumbnail in a row
|
||||
- applying odd/even classes to rows in a table
|
||||
- applying a unique class to the last product thumbnail in a row
|
||||
|
||||
## cycle (parameters)
|
||||
|
||||
`cycle` accepts a parameter called `cycle group` in cases where you need multiple `cycle` blocks in one template. If no name is supplied for the cycle group, then it is assumed that multiple calls with the same parameters are one group.
|
||||
`cycle` accepts a "cycle group" parameter in cases where you need multiple `cycle` blocks in one template. If no name is supplied for the cycle group, then it is assumed that multiple calls with the same parameters are one group.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% cycle "first": "one", "two", "three" %}
|
||||
{% cycle "second": "one", "two", "three" %}
|
||||
{% cycle "second": "one", "two", "three" %}
|
||||
{% cycle "first": "one", "two", "three" %}
|
||||
{% endraw %}
|
||||
```
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
one
|
||||
one
|
||||
two
|
||||
two
|
||||
```
|
||||
|
||||
## tablerow
|
||||
|
||||
|
||||
+6
-5
@@ -21,10 +21,10 @@ Creates a new variable.
|
||||
|
||||
<p class="code-label">Output</p>
|
||||
```text
|
||||
This statement is valid.
|
||||
This statement is valid.
|
||||
```
|
||||
|
||||
Wrap a variable in quotations `"` to save it as a string.
|
||||
Wrap a variable value in quotations `"` to save it as a string.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -41,7 +41,7 @@ bar
|
||||
|
||||
## capture
|
||||
|
||||
Captures the string inside of the opening and closing tags and assigns it to a variable. Variables created through `{% raw %}{% capture %}{% endraw %}` are strings.
|
||||
Captures the string inside of the opening and closing tags and assigns it to a variable. Variables created through `capture` are strings.
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
@@ -55,12 +55,13 @@ Captures the string inside of the opening and closing tags and assigns it to a v
|
||||
```text
|
||||
I am being captured.
|
||||
```
|
||||
Using `capture`, you can create complex strings using other variables created with `assign`.
|
||||
|
||||
Using `capture`, you can create complex strings using other variables created with `assign`:
|
||||
|
||||
<p class="code-label">Input</p>
|
||||
```liquid
|
||||
{% raw %}
|
||||
{% assign favorite_food = 'pizza' %}
|
||||
{% assign favorite_food = "pizza" %}
|
||||
{% assign age = 35 %}
|
||||
|
||||
{% capture about_me %}
|
||||
|
||||
Reference in New Issue
Block a user