Filters

abs

Liquid filter that returns the absolute value of a number.
Input
{{ -17 | abs }}
Output
17
Input
{{ 4 | abs }}
Output
4
abs will also work on a string that only contains a number: 
Input
{{ "-19.86" | abs }}
Output
19.86

append

Concatenates two strings and returns the concatenated value.
Input
{{ "/my/fancy/url" | append: ".html" }}
Output
/my/fancy/url.html
append can also be used with variables:
Input
{% assign filename = "/index.html" %}
{{ "website.com" | append: filename }}
Output
website.com/index.html

array_to_sentence_string

Convert an array into a sentence. Useful for listing tags. Optional argument for connector.
Input
{{ "foo,bar,baz" | split: "," | array_to_sentence_string }}
Output
foo, bar, and baz
Input
{{ "foo,bar,baz" | split: "," | array_to_sentence_string: "or" }}
Output
foo, bar, or baz

at_least

Limits a number to a minimum value.
Input
{{ 4 | at_least: 5 }}
Output
5
Input
{{ 4 | at_least: 3 }}
Output
4

at_most

Limits a number to a maximum value.
Input
{{ 4 | at_most: 5 }}
Output
4
Input
{{ 4 | at_most: 3 }}
Output
3

capitalize

Makes the first character of a string capitalized.
Input
{{ "title" | capitalize }}
Output
Title
capitalize only capitalizes the first character of a string, so later words are not affected:
Input
{{ "my great title" | capitalize }}
Output
My great title

ceil

Rounds the input up to the nearest whole number. Liquid tries to convert the input to a number before the filter is applied.
Input
{{ 1.2 | ceil }}
Output
2
Input
{{ 2.0 | ceil }}
Output
2
Input
{{ 183.357 | ceil }}
Output
184
Here the input value is a string: Input
{{ "3.5" | ceil }}
Output
4

cgi_escape

CGI escape a string for use in a URL. Replaces any special characters with appropriate %XX replacements. CGI escape normally replaces a space with a plus + sign.
Input
{{ "foo, bar; baz?" | cgi_escape }}
Output
foo%2C+bar%3B+baz%3F

compact

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.
Input
{% assign site_categories = site.pages | map: "category" %}

{% for category in site_categories %}
- {{ category }}
{% endfor %}
Output
- 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.
Input
{% assign site_categories = site.pages | map: "category" | compact %}

{% for category in site_categories %}
- {{ category }}
{% endfor %}
Output
- business
- celebrities
- lifestyle
- sports
- technology

concat

Concatenates (joins together) multiple arrays. The resulting array contains all the items from the input arrays.
Input
{% assign fruits = "apples, oranges, peaches" | split: ", " %}
{% assign vegetables = "carrots, turnips, potatoes" | split: ", " %}

{% assign everything = fruits | concat: vegetables %}

{% for item in everything %}
- {{ item }}
{% endfor %}
Output
- apples
- oranges
- peaches
- carrots
- turnips
- potatoes
You can string together concat filters to join more than two arrays:
Input
{% assign furniture = "chairs, tables, shelves" | split: ", " %}

{% assign everything = fruits | concat: vegetables | concat: furniture %}

{% for item in everything %}
- {{ item }}
{% endfor %}
Output
- apples
- oranges
- peaches
- carrots
- turnips
- potatoes
- chairs
- tables
- shelves

date

Date filter is used to convert a timestamp into the specified format. Liquid tries to conform to Shopify Liquid, which uses Ruby’s core . There’re differences with : %Z (since ) is replaced by the passed-in timezone name from liquidOption or in-place value (see TimeZone below). If passed-in timezone is an offset number instead of string, it’ll behave like %z. If there’s none passed-in timezone, it returns.
Liquid provides an additional %q flag for date ordinals. e.g. {{ '2023/02/02' | date: '%d%q of %b'}} => 02nd of Feb Date literals are firstly converted to Date object via , that means literal values are considered in runtime’s time zone by default. The format filter argument is optional: If not provided, it defaults to %A, %B %-e, %Y at %-l:%M %P %z. The above default can be overridden by Liquid option. Liquid date supports locale specific weekdays and month names, which will fallback to English where Intl is not supported. Ordinals (%q) and Jekyll specific date filters are English-only. can be set when creating Liquid instance. Defaults to Intl.DateTimeFormat().resolvedOptions.locale).
Examples
{{ article.published_at | date: '%a, %b %d, %y' }} => Fri, Jul 17, 15
{{ "now" | date: "%Y-%m-%d %H:%M" }} => 2020-03-25 15:57

// equivalent to setting options.dateFormat = %d%q of %b %Y at %I:%M %P %Z
{{ '1990-12-31T23:30:28Z' | date: '%d%q of %b %Y at %I:%M %P %Z', -330 }} => 01st of Jan 1991 at 05:00 am +0530;
TimeZone During output, Liquid uses local timezone which can override by: setting a timezone in-place when calling date filter, or setting the Liquid option It defaults to runtime’s time one. Offset can be set as, minutes: -360 means '+06:00' and 360 means '-06:00' timeZone ID: Asia/Colombo or America/New_York See for TZ database values
Examples
// equivalent to setting `options.timezoneOffset` to `360`
{{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", 360 }} => 1990-12-31T17:00:00
{{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", "Asia/Colombo" }} => 1991-01-01T04:30:00
Input date works on strings if they contain well-formatted dates Note that Liquid is using to parse the input string, that means and strings in are supported.
Examples
{{ "1990-12-31T23:00:00Z" | date: "%Y-%m-%dT%H:%M:%S", 360 }} => 1990-12-31T17:00:00
{{ "March 14, 2016" | date: "%b %d, %y" }} => Mar 14, 16
Current Date To get the current time, pass the special word "now" or "today" as input Note that the value will be the current time of when the page was last generated from the template, not when the page is presented to a user if caching or static site generation is involved Example
Last updated on: {{ "now" | date: "%Y-%m-%d %H:%M" }} => Last updated on: 2020-03-25 15:57
Last updated on: {{ "today" | date: "%Y-%m-%d %H:%M" }} => Last updated on: 2020-03-25 15:57

date_to_long_string

Convert a date to long format.
Input
{{ site.time | date_to_long_string }}
Output
07 November 2008
Input
{{ site.time | date_to_long_string: "ordinal" }}
Output
7th November 2008
Note that JavaScript Date has not timezone information, see filter for details.

date_to_rfc822

Convert a Date into the RFC-822 format used for RSS feeds, same as Jekyll filter date_to_rfc822.
Input
{{ site.time | date_to_rfc822 }}
Output
Mon, 07 Nov 2008 13:07:54 -0800
Note that JavaScript Date has not timezone information, see filter for details.

date_to_string

Convert a date to short format. Same with Jekyll date_to_string filter.
Input
{{ site.time | date_to_string }}
Output
07 Nov 2008
Input
{{ site.time | date_to_string: "ordinal", "US" }}
Output
Nov 7th, 2008
Note that JavaScript Date has not timezone information, see filter for details.

date_to_xmlschema

Convert a Date into XML Schema (ISO 8601) format, same as Jekyll filter date_to_xmlschema.
Input
{{ site.time | date_to_xmlschema }}
Output
2008-11-07T13:07:54-08:00
Note that JavaScript Date has not timezone information, see filter for details.

default

Allows you to specify a fallback in case a value doesn’t exist. default will show its value if the left side is or empty (string or Array). In this example, product_price is not defined, so the default value is used.
Input
{{ product_price | default: 2.99 }}
Output
2.99
In this example, product_price is defined, so the default value is not used.
Input
{% assign product_price = 4.99 %}
{{ product_price | default: 2.99 }}
Output
4.99
In this example, product_price is empty, so the default value is used.
Input
{% assign product_price = "" %}
{{ product_price | default: 2.99 }}
Output
2.99

Allowing false

To allow variables to return false instead of the default value, you can use the allow_false parameter.
Input
{% assign display_price = false %}
{{ display_price | default: true, allow_false: true }}
Output
false

divided_by

Divides a number by another number. The result is the string obtained by JavaScript .toString() of the result number.
Input
{{ 16 | divided_by: 4 }}
Output
4
Input
{{ 5 | divided_by: 3 }}
Output
1.6666666666666667
In JavaScript, float and integer shares the same type number and we cannot tell the difference.
For example:
// always true
5.0 === 5
You’ll need to pass another integerArithmetic argument to enforce integer divide:
Input
{{ 5 | divided_by: 3, true }}
Output
1

downcase

Makes each character in a string lowercase. It has no effect on strings which are already all lowercase.
Input
{{ "Parker Moore" | downcase }}
Output
parker moore
Input
{{ "apple" | downcase }}
Output
apple

escape

Escapes a string by replacing HTML special characters with escape sequences. It doesn’t change strings that don’t have anything to escape.
Input
{{ "Have you read 'James & the Giant Peach'?" | escape }}
Output
Have you read 'James & the Giant Peach'?
Input
{{ "Tetsuro Takara" | escape }}
Output
Tetsuro Takara

escape_once

Escapes a string without changing existing escaped entities. It doesn’t change strings that don’t have anything to escape.
Input
{{ "1 < 2 & 3" | escape_once }}
Output
1 &lt; 2 &amp; 3
Input
{{ "1 &lt; 2 &amp; 3" | escape_once }}
Output
1 &lt; 2 &amp; 3

find

Return the first object in an array for which the queried attribute has the given value or return nil if no item in the array satisfies the given criteria.
For the following members array:
const members = [
  { graduation_year: 2013, name: 'Jay' },
  { graduation_year: 2014, name: 'John' },
  { graduation_year: 2014, name: 'Jack' }
]
Input
{{ members | find: "graduation_year", 2014 | json }}
Output
{"graduation_year":2014,"name":"John"}

find_exp

Return the first object in an array for which the given expression evaluates to true or return nil if no item in the array satisfies the evaluated expression.
const members = [
  { graduation_year: 2013, name: 'Jay' },
  { graduation_year: 2014, name: 'John' },
  { graduation_year: 2014, name: 'Jack' }
]
Input
{{ members | find_exp: "item", "item.graduation_year == 2014" | json }}
Output
{"graduation_year":2014,"name":"John"}

first

Returns the first item of an array.
Input
{{ "Ground control to Major Tom." | split: " " | first }}
Output
Ground
Input
{% assign my_array = "zebra, octopus, giraffe, tiger" | split: ", " %}
{{ my_array.first }}
Output
zebra
You can use first with dot notation when you need to use the filter inside a tag:
{% if my_array.first == "zebra" %}
  Here comes a zebra!
{% endif %}

floor

Rounds the input down to the nearest whole number. Liquid tries to convert the input to a number before the filter is applied. Input
{{ 1.2 | floor }}
Output
1
Input
{{ 2.0 | floor }}
Output
2
Input
{{ 183.357 | floor }}
Output
183
Here the input value is a string: Input
{{ "3.5" | floor }}
Output
3

group_by

Group an array’s items by a given property. For members array:
const members = [
  { graduation_year: 2003, name: 'Jay' },
  { graduation_year: 2003, name: 'John' },
  { graduation_year: 2004, name: 'Jack' }
]
Input
{{ members | group_by: "graduation_year" | json: 2 }}
Output
[
  {
    "name": 2003,
    "items": [
      {
        "graduation_year": 2003,
        "name": "Jay"
      },
      {
        "graduation_year": 2003,
        "name": "John"
      }
    ]
  },
  {
    "name": 2004,
    "items": [
      {
        "graduation_year": 2004,
        "name": "Jack"
      }
    ]
  }
]

group_by_exp

Group an array’s items using a Liquid expression.
For members array below:
const members = [
  { graduation_year: 2013, name: 'Jay' },
  { graduation_year: 2014, name: 'John' },
  { graduation_year: 2009, name: 'Jack' }
]
Input
{{ members | group_by_exp: "item", "item.graduation_year | truncate: 3, ''" | json: 2 }}
Output
[
  {
    "name": "201",
    "items": [
      {
        "graduation_year": 2013,
        "name": "Jay"
      },
      {
        "graduation_year": 2014,
        "name": "John"
      }
    ]
  },
  {
    "name": "200",
    "items": [
      {
        "graduation_year": 2009,
        "name": "Jack"
      }
    ]
  }
]

inspect

Similar with json, but inspect allows cyclic structure.
For the scope below:
const foo = {
    bar: 'BAR'
}
foo.foo = foo
const scope = { foo }
Input
{% foo | inspect %}
Output
{"bar":"BAR","foo":"[Circular]"}

Formatting

An additional space argument can be specified for the indent width.
Input
{{ foo | inspect: 4 }}
Output
{
    "bar": "BAR",
    "foo": "[Circular]"
}

join

Combines the items in an array into a single string using the argument as a separator.
Input
{% assign beatles = "John, Paul, George, Ringo" | split: ", " %}
{{ beatles | join: " and " }}
Output
John and Paul and George and Ringo

json

Convert values to string via JSON.stringify(), for debug purpose.
Input
{% assign arr = "foo bar coo" | split: " " %}
{{ arr | json }}
Output
["foo","bar","coo"]

Space

An additional space parameter can be specified to format the JSON.
Input
{% assign arr = "foo bar coo" | split: " " %}
{{ arr | json: 4 }}
Output
[
    "foo",
    "bar",
    "coo"
]

jsonify

See .

last

Returns the last item of an array.
Input
{{ "Ground control to Major Tom." | split: " " | last }}
Output
Tom.
Input
{% assign my_array = "zebra, octopus, giraffe, tiger" | split: ", " %}
{{ my_array.last }}
Output
tiger
You can use last with dot notation when you need to use the filter inside a tag:
{% if my_array.last == "tiger" %}
  There goes a tiger!
{% endif %}

lstrip

Removes all whitespace (tabs, spaces, and newlines) from the left side of a string. It does not affect spaces between words.
Input
BEGIN{{ "          So much room for activities!          " | lstrip }}END
Output
BEGINSo much room for activities!          END

map

Creates an array of values by extracting the values of a named property from another object. In this example, assume the object site.pages contains all the metadata for a website. Using assign with the map filter creates a variable that contains only the values of the category properties of everything in the site.pages object.
Input
{% assign all_categories = site.pages | map: "category" %}

{% for item in all_categories %}
- {{ item }}
{% endfor %}
Output
- business
- celebrities
- lifestyle
- sports
- technology

minus

Subtracts a number from another number.
Input
{{ 4 | minus: 2 }}
Output
2
Input
{{ 16 | minus: 4 }}
Output
12
Input
{{ 183.357 | minus: 12 }}
Output
171.357

modulo

Returns the remainder of a division operation.
Input
{{ 3 | modulo: 2 }}
Output
1
Input
{{ 24 | modulo: 7 }}
Output
3
Input
{{ 183.357 | modulo: 12 }}
Output
3.3569999999999993

newline_to_br

Replaces every newline (\n) in a string with an HTML line break (<br />).
Input
{% capture string_with_newlines %}
Hello
there
{% endcapture %}

{{ string_with_newlines | newline_to_br }}
Output
<br/>Hello<br/>there<br/>

normalize_whitespace

Replace any occurrence of whitespace with a single space. Input
{{ "a \n b" | normalize_whitespace }}
Output
a b

number_of_words

Count the number of words in some text. This filter takes an optional argument to control the handling of Chinese-Japanese-Korean (CJK) characters in the input string: Passing 'cjk' as the argument will count every CJK character detected as one word irrespective of being separated by whitespace. Passing 'auto' (auto-detect) works similar to 'cjk' but is more performant if the filter is used on a variable string that may or may not contain CJK chars.
Input
{{ "Hello world!" | number_of_words }}
Output
2
Input
{{ "你好hello世界world" | number_of_words }}
Output
1
Input
{{ "你好hello世界world" | number_of_words: "cjk" }}
Output
6
Input
{{ "你好hello世界world" | number_of_words: "auto" }}
Output
6

plus

Adds a number to another number.
Input
{{ 4 | plus: 2 }}
Output
6
Input
{{ 16 | plus: 4 }}
Output
20
Input
{{ 183.357 | plus: 12 }}
Output
195.357

pop

Pop an element from the array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.
Input
{% assign fruits = "apples, oranges, peaches" | split: ", " %}

{% assign everything = fruits | pop %}

{% for item in everything %}
- {{ item }}
{% endfor %}
Output
- apples
- oranges

push

Push an element into array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.
Input
{% assign fruits = "apples, oranges" | split: ", " %}

{% assign everything = fruits | push: "peaches" %}

{% for item in everything %}
- {{ item }}
{% endfor %}
Output
- apples
- oranges
- peaches

prepend

Adds the specified string to the beginning of another string.
Input
{{ "apples, oranges, and bananas" | prepend: "Some fruit: " }}
Output
Some fruit: apples, oranges, and bananas
prepend can also be used with variables: Input
{% assign url = "example.com" %}
{{ "/index.html" | prepend: url }}
Output
example.com/index.html

raw

WISMOlabs liquid filter that directly returns the value of the variable. Useful when is set. Auto escapeBy default outputEscape is not set. That means Liquid output is not escaped by default, thus raw filter is not useful until outputEscape is set.
Input (outputEscape not set)
{{ "<" }}
Output
<
Input (outputEscape="escape")
{{ "<" }}
Output
&lt;
Input (outputEscape="json")
{{ "<" }}
Output
"<"
Input (outputEscape="escape")
{{ "<" | raw }}
Output
<

remove

Removes every occurrence of the specified substring from a string.
Input
{{ "I strained to see the train through the rain" | remove: "rain" }}
Output
I sted to see the t through the 

remove_first

Removes only the first occurrence of the specified substring from a string.
Input
{{ "I strained to see the train through the rain" | remove_first: "rain" }}
Output
I sted to see the train through the rain

remove_last

Removes only the last occurrence of the specified substring from a string.
Input
{{ "I strained to see the train through the rain" | remove_last: "rain" }}
Output
I strained to see the train through the

replace

Replaces every occurrence of the first argument in a string with the second argument.
Input
{{ "Take my protein pills and put my helmet on" | replace: "my", "your" }}
Output
Take your protein pills and put your helmet on

replace_first

Replaces only the first occurrence of the first argument in a string with the second argument.
Input
{{ "Take my protein pills and put my helmet on" | replace_first: "my", "your" }}
Output
Take your protein pills and put my helmet on

replace_last

Replaces only the last occurrence of the first argument in a string with the second argument.
Input
{{ "Take my protein pills and put my helmet on" | replace_last: "my", "your" }}
Output
Take my protein pills and put your helmet on

reverse

Reverses the order of the items in an array. reverse cannot reverse a string.
Input
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}

{{ my_array | reverse | join: ", " }}
Output
plums, peaches, oranges, apples
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:
Input
{{ "Ground control to Major Tom." | split: "" | reverse | join: "" }}
Output
.moT rojaM ot lortnoc dnuorG

round

Rounds a number to the nearest integer or, if a number is passed as an argument, to that number of decimal places.
Input
{{ 1.2 | round }}
Output
1
Input
{{ 2.7 | round }}
Output
3
Input
{{ 183.357 | round: 2 }}
Output
183.36

rstrip

Removes all whitespace (tabs, spaces, and newlines) from the right side of a string. It does not affect spaces between words.
Input
BEGIN{{ "          So much room for activities!          " | rstrip }}END
Output
BEGIN          So much room for activities!END

shift

Shift an element from the array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.
Input
{% assign fruits = "apples, oranges, peaches" | split: ", " %}

{% assign everything = fruits | shift %}

{% for item in everything %}
- {{ item }}
{% endfor %}
Output
- oranges
- peaches

size

Returns the number of characters in a string or the number of items in an array.
Input
{{ "Ground control to Major Tom." | size }}
Output
28
Input
{% assign my_array = "apples, oranges, peaches, plums" | split: ", " %}

{{ my_array.size }}
Output
4
You can use size with dot notation when you need to use the filter inside a tag:
{% if site.pages.size > 10 %}
  This is a big website!
{% endif %}

slice

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.
Input
{{ "WISMOlabs liquid" | slice: 0 }}
Output
L
Input
{{ "WISMOlabs liquid" | slice: 2 }}
Output
q
Input
{{ "WISMOlabs liquid" | slice: 2, 5 }}
Output
quid
If the first argument is a negative number, the indices are counted from the end of the string:
Input
{{ "WISMOlabs liquid" | slice: -3, 2 }}
Output
ui

slugify

Convert a string into a lowercase URL “slug”. The slugify filter accepts 2 options: mode: string. The default is "default". They are as follows (with what they filter): "none": no characters "raw": spaces "default": spaces and non-alphanumeric characters "pretty": spaces and non-alphanumeric characters except for ._~!$&'()+,;=@ "ascii": spaces, non-alphanumeric, and non-ASCII characters "latin": like default, except Latin characters are first transliterated (e.g. àèïòü to aeiou). case: boolean. The default is false. The original case of slug will be retained if set to true.
Input
{{ "The _config.yml file" | slugify }}
Output
the-config-yml-file
Input
{{ "The _config.yml file" | slugify: "pretty" }}
Output
the-_config.yml-file
Input
{{ "The _cönfig.yml file" | slugify: "ascii" }}
Output
the-c-nfig-yml-file
Input
{{ "The cönfig.yml file" | slugify: "latin" }}
Output
the-config-yml-file
Input
{{ "The cönfig.yml file" | slugify: "latin", true }}
Output
The-config-yml-file

sort

Sorts items in an array in case-sensitive order.
Input
{% assign my_array = "zebra, octopus, giraffe, Sally Snake" | split: ", " %}

{{ my_array | sort | join: ", " }}
Output
Sally Snake, giraffe, octopus, zebra
An optional argument specifies which property of the array’s items to use for sorting.
{% assign products_by_price = collection.products | sort: "price" %}
{% for product in products_by_price %}
  <h4>{{ product.title }}</h4>
{% endfor %}

sort_natural

Sorts items in an array in case-insensitive order.
Input
{% assign my_array = "zebra, octopus, giraffe, Sally Snake" | split: ", " %}

{{ my_array | sort_natural | join: ", " }}
Output
giraffe, octopus, Sally Snake, zebra
An optional argument specifies which property of the array’s items to use for sorting.
{% assign products_by_company = collection.products | sort_natural: "company" %}
{% for product in products_by_company %}
  <h4>{{ product.title }}</h4>
{% endfor %}

split

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.
Input
{% assign beatles = "John, Paul, George, Ringo" | split: ", " %}

{% for member in beatles %}
  {{ member }}
{% endfor %}
Output
John

Paul

George

Ringo

strip

Removes all whitespace (tabs, spaces, and newlines) from both the left and right sides of a string. It does not affect spaces between words.
Input
BEGIN{{ "          So much room for activities!          " | strip }}END
Output
BEGINSo much room for activities!END

strip_html

Removes any HTML tags from a string.
Input
{{ "Have <em>you</em> read <strong>Ulysses</strong>?" | strip_html }}
Output
Have you read Ulysses?

strip_newlines

Removes any newline characters (line breaks) from a string.
Input
{% capture string_with_newlines %}
Hello
there
{% endcapture %}

{{ string_with_newlines | strip_newlines }}
Output
Hellothere

sum

Computes the sum of all the numbers in an array.An optional argument specifies which property of the array’s items to sum up. In this example, assume the object cart.products contains an array of all products in the cart of a website.Assume each cart product has a qty property that gives the count of that product instance in the cart.Using the sum filter we can calculate the total number of products in the cart.
Input
The cart has {{ order.products | sum: "qty" }} products.
Output
The cart has 7 products.

times

Multiplies a number by another number.
Input
{{ 3 | times: 2 }}
Output
6
Input
{{ 24 | times: 7 }}
Output
168
Input
{{ 183.357 | times: 12 }}
Output
2200.284

to_integer

Convert values to number.
Input
{{ "123" | to_integer | json }}
Output
123

truncate

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.

Basic Usage

Input
{{ "Ground control to Major Tom." | truncate: 20 }}
Output
Ground control to...

Custom ellipsis

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 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.
Input
{{ "Ground control to Major Tom." | truncate: 25, ", and so on" }}
Output
Ground control, and so on

No ellipsis

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:
Input
{{ "Ground control to Major Tom." | truncate: 20, "" }}
Output
Ground control to Ma

truncatewords

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.
Input
{{ "Ground control to Major Tom." | truncatewords: 3 }}
Output
Ground control to...
Custom ellipsistruncatewords 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.
Input
{{ "Ground control to Major Tom." | truncatewords: 3, "--" }}
Output
Ground control to--
No ellipsisYou can avoid showing trailing characters by passing a blank string as the second argument:
Input
{{ "Ground control to Major Tom." | truncatewords: 3, "" }}
Output
Ground control to

uniq

Removes any duplicate elements in an array. Input
{% assign my_array = "ants, bugs, bees, bugs, ants" | split: ", " %}
{{ my_array | uniq | join: ", " }}
Output
ants, bugs, bees

unshift

Unshift an element to the front of the array. It’s NON-DESTRUCTIVE, i.e. it does not mutate the array, but rather make a copy and mutate that.
Input
{% assign fruits = "oranges, peaches" | split: ", " %}

{% assign everything = fruits | unshift: "apples" %}

{% for item in everything %}
- {{ item }}
{% endfor %}
Output
- apples
- oranges
- peaches

upcase

Makes each character in a string uppercase. It has no effect on strings which are already all uppercase.
Input
{{ "Parker Moore" | upcase }}
Output
PARKER MOORE
Input
{{ "APPLE" | upcase }}
Output
APPLE

uri_escape

Percent encodes any special characters in a URI. URI escape normally replaces a space with %20. will not be escaped. 
Input
{{ "https://example.com/?q=foo, \bar?" | uri_escape }}
Output
https://example.com/?q=foo,%20%5Cbar?

url_decode

Decodes a string that has been encoded as a URL.
Input
{{ "%27Stop%21%27+said+Fred" | url_decode }}
Output
'Stop!' said Fred

url_encode

Converts any URL-unsafe characters in a string into percent-encoded characters.
Input
{{ "john@liquid.com" | url_encode }}
Output
john%40liquid.com
Input
{{ "Tetsuro Takara" | url_encode }}
Output
Tetsuro+Takara

where

Creates an array including only the objects with a given property value, or any 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".
Input
All products:
{% for product in products %}
- {{ product.title }}
{% endfor %}

{% assign kitchen_products = products | where: "type", "kitchen" %}

Kitchen products:
{% for product in kitchen_products %}
- {{ product.title }}
{% endfor %}
Output
All products:
- Vacuum
- Spatula
- Television
- Garlic press

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 "available" value.
Input
All products:
{% for product in products %}
- {{ product.title }}
{% endfor %}

{% assign available_products = products | where: "available" %}

Available products:
{% for product in available_products %}
- {{ product.title }}
{% endfor %}
Output
All products:
- Coffee mug
- Limited edition sneakers
- Boring sneakers

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.
Input
{% assign new_shirt = products | where: "type", "shirt" | first %}

Featured product: {{ new_shirt.title }}
Output
Featured product: Hawaiian print sweater vest
Additionally, property can be any valid Liquid variable expression as used in output syntax, except that the scope of this expression is within each item.
For the following products array:
const products = [
    { meta: { details: { class: 'A' } }, order: 1 },
    { meta: { details: { class: 'B' } }, order: 2 },
    { meta: { details: { class: 'B' } }, order: 3 }
]
Input
{% assign selected = products | where: 'meta.details["class"]', "B" %}
{% for item in selected -%}
- {{ item.order }}
{% endfor %}
Output
- 2
- 3

where_exp

Select all the objects in an array where the expression is true. In this example, assume you have a list of products and you want to show your kitchen products separately. Using where_exp, you can create an array containing only the products that have a "type" of "kitchen".
Input
All products:
{% for product in products %}
- {{ product.title }}
{% endfor %}

{% assign kitchen_products = products | where_exp: "item", "item.type == 'kitchen'" %}

Kitchen products:
{% for product in kitchen_products %}
- {{ product.title }}
{% endfor %}
Output
All products:
- Vacuum
- Spatula
- Television
- Garlic press

Kitchen products:
- Spatula
- Garlic press

xml_escape

Escape some text for use in XML. Input
{{ "Have you read \'James & the Giant Peach\'?" | xml_escape }}
Output
Have you read &#39;James &amp; the Giant Peach&#39;?


Related Articles