Date filter
date
Formats a date string using specified formats
Example
Input
{{ '2024-09-05T13:59:07Z' | date:'%F' }}
Output
2024-09-05
Date filter specifiers
Various ISO 8601 formats
Format specifier | Output | Description |
---|---|---|
%Y%m%d | 20071119 | Calendar date (basic) |
%F | 2007-11-19 | Calendar date (extended) |
%Y-%m | 2007-11 | Calendar date, reduced accuracy, specific month |
%Y | 2007 | Calendar date, reduced accuracy, specific year |
%C | 20 | Calendar date, reduced accuracy, specific century |
%Y%j | 2007323 | Ordinal date (basic) |
%Y-%j | 2007-323 | Ordinal date (extended) |
%GW%V%u | 2007W471 | Week date (basic) |
%G-W%V-%u | 2007-W47-1 | Week date (extended) |
%GW%V | 2007W47 | Week date, reduced accuracy, specific week (basic) |
%G-W%V | 2007-W47 | Week date, reduced accuracy, specific week (extended) |
%H%M%S | 083748 | Local time (basic) |
%T | 08:37:48 | Local time (extended) |
%H%M | 0837 | Local time, reduced accuracy, specific minute (basic) |
%H:%M | 08:37 | Local time, reduced accuracy, specific minute (extended) |
%H | 08 | Local time, reduced accuracy, specific hour |
%H%M%S,%L | 083748,000 | Local time with decimal fraction, comma as decimal sign (basic) |
%T,%L | 08:37:48,000 | Local time with decimal fraction, comma as decimal sign (extended) |
%H%M%S.%L | 083748.000 | Local time with decimal fraction, full stop as decimal sign (basic) |
%T.%L | 08:37:48.000 | Local time with decimal fraction, full stop as decimal sign (extended) |
%H%M%S%z | 083748-0600 | Local time and the difference from UTC (basic) |
%T%:z | 08:37:48-06:00 | Local time and the difference from UTC (extended) |
%Y%m%dT%H%M%S%z | 20071119T083748-0600 | Date and time of day for calendar date (basic) |
%FT%T%:z | 2007-11-19T08:37:48-06:00 | Date and time of day for calendar date (extended) |
%Y%jT%H%M%S%z | 2007323T083748-0600 | Date and time of day for ordinal date (basic) |
%Y-%jT%T%:z | 2007-323T08:37:48-06:00 | Date and time of day for ordinal date (extended) |
%GW%V%uT%H%M%S%z | 2007W471T083748-0600 | Date and time of day for week date (basic) |
%G-W%V-%uT%T%:z | 2007-W47-1T08:37:48-06:00 | Date and time of day for week date (extended) |
%Y%m%dT%H%M | 20071119T0837 | Calendar date and local time (basic) |
%FT%R | 2007-11-19T08:37 | Calendar date and local time (extended) |
%Y%jT%H%MZ | 2007323T0837Z | Ordinal date and UTC of day (basic) |
%Y-%jT%RZ | 2007-323T08:37Z | Ordinal date and UTC of day (extended) |
%GW%V%uT%H%M%z | 2007W471T0837-0600 | Week date and local time and difference from UTC (basic) |
%G-W%V-%uT%R%:z | 2007-W47-1T08:37-06:00 | Week date and local time and difference from UTC (extended) |
HTML-tag and URL filters
img_url
Example, Liquid for the
src
attribute in animg
-tagInput
{{ article | img_url:0,50 }}
Output
/media/article/17f95478-638c-8c2f-b2eb-501ae41bd00b/Cradle-CMS-code-editor_0_50.png
product_img_url
Example product image
Input
{{ products[0] | product_img_url | img_tag:'alt-title' }}
Output
<img src="/media/product/17669fb0-983f-4ada-bc29-f9d80ff3e8c3/cradle-cms-productimage.webp" alt="alt-title" />
asset_img_url
Example asset image
Input
{{ settings.featureSectionImage | asset_img_url:0,50 }}
Output
/assets/docker-logo-blue_0_50.png
link_tag
Outputs <a href="url"...></a>
link tag
Example
Input
{{ vendors[0] | url | link_tag:vendors[0].name }}
Output
<a href="/https:/cradlecms.com" >Cradle</a>
script_tag
Outputs <script type="text/javascript" ...></script>
tag for a link.
Example, filename and asset_url filter
Input
{{ 'myscript.js' | asset_url | script_tag }}
Output
<script type="application/javascript" src="/assets/myscript.js" ></script>
Example, filename with path
Input
{{ '/assets/myscript.js' | script_tag }}
Output
<script type="application/javascript" src="/assets/myscript.js" ></script>
Example, full url
Input
{{ 'https://cradlecms.com/assets/myscript.js' | script_tag }}
Output
<script type="application/javascript" src="https://cradlecms.com/assets/myscript.js" ></script>
stylesheet_tag
Outputs <link rel="stylesheet" ...>
tag
Example, filename and asset_url filter
Input
{{ 'mystyle.css' | asset_url | script_tag }}
Output
<script type="application/javascript" src="/assets/mystyle.css" ></script>
Example, filename with path
Input
{{ '/assets/mystyle.css' | script_tag }}
Output
<script type="application/javascript" src="/assets/mystyle.css" ></script>
Example, full URL
Input
{{ 'https://cradlecms.com/assets/mystyle.css' | script_tag }}
Output
<script type="application/javascript" src="https://cradlecms.com/assets/mystyle.css" ></script>
url
Prints the URL path for an object
Example
Input
{{ article | url }}
Output
/blogs/docs/article/template-filters
Special filters
def
Returns a default value if the left side is undefined
Example
Input
{{ something_undefined | def:"The variable was not defined" }}
Output
The variable was not defined
related
Returns related collections, products, pages or articles having shared properties 'tag','vendor','collection','type' when in the object context.
Example
Input
{% assign relatedArticles = article | related:'tag' %} {% for article in relatedArticles limit:5 %}
{{ article.meta.h1 }}
{% endfor %}Output
Products
Configuration overview
What is ISO 27001?
What is BGP?
What is ENISA and NIS2?
Liquid snippet for related products
{% assign relatedProducts = product | related %} {% for product in relatedProducts limit:5 %} {% include 'productCard' %} {% endfor %}
render
Serverside renders the content. Normally the content of a page, page.html
, is not rendered but addning the filter will render the content and liquid can be used in the page editor.
Example
Input
{{ 'article.html' | render }}
Output
Liquid tags will be replaced within the content.
url_encode
Url encodes a string
Example
Input
{% '100% of all ÅÄÖ' | url_encode %}}
Output
100%25+of+all+%C3%85%C3%84%C3%96
Math filters
ceil
Rounds number up to closest integer
Example
Input
{{ 4.6 | ceil }}
Output
5
divided_by
Integer division (in which the fractional part, the remainder, is discarded)
Example
Input
{{ 7 | divided_by:3 }}
Output
2
floor
Rounds number down to closest integer
Example
Input
{{ 4.6 | floor }}
Output
4
minus
Subtraction by an integer
Example
Input
{{ 3 | minus:1 }}
Output
2
Example with decimals
Input
{{ 3.6 | minus:1.4 }}
Output
2.2
modulo
Returns the remainder after division
Example
Input
{{ 7 | modulo:4 }}
Output
3
Example
Input
{{ 37 | modulo:5 }}
Output
2
plus
Addition of integers
Example
Input
{{ '1' | plus:'2' }}
Output
3
Example with decimals
Input
{{ '13.5' | plus:'2.9' }}
Output
16.4
round
Rounds input to the number of decimals
Example
Input
{{ 3.141562 | round: 2 }}
Output
3.14
times
Multiplication by integer
Example
Input
{{ 2 | times:3 }}
Output
6
Example, with decimals
Input
{{ 2.5 | times:3.7 }}
Output
9.25
String and Array filters
append
Appends a string
Example
Input
{{ 'test' | append:'-' | append:'me' }}
Output
test-me
capitalize
Capitalizes the first word
Example
Input
{{ 'hello world' | capitalize }}
Output
Hello world
downcase
Converts input to lowercase
Example
Input
{{ "WasCamelCased" | downcase }}
Output
wascamelcased
escape
Escapes special characters like <
to become <
. It escapes only five such characters: <
, >
, &
, '
and .
Example
Input
{{ "Click > Here & There" | escape }}
Output
Note that the browser will not show the HTML Character Entity codesClick > Here & There
first
Returns the first element of an array
Example
We first create an array named fish from a string.
Input
{% assign fish = "Cod,Mackerel,Trout,Salmon" | split: "," %} {{ fish | first }}
Output
Cod
last
Returns the last element of an array
Example
Input
{{ fish | last }}
Output
Salmon
handleize
Transforms string to a handle format
Example
Input
{{ 'jeans collection' | handleize }}
Output
jeans-collection
insert
insert replaces "%s %1..%n" in source with matching str[arg-n]
Example
Input
{{'insert %s here' | insert:'something'}}
Output
"insert something here"
Example
Input
{{'hello %1%2' | insert:'world','!'}}
Output
"hello world!"
join
Joins elements of array with a separator
Example
Input
[ "Cod", "Mackerel", "Trout", "Salmon" ]{{ fish | join:', ' }}
Output
Cod, Mackerel, Trout, Salmon
strip
Strips whitespace from both sides of a string
Example
Input
{{ " hello " | strip }}
Output
"hello"
lstrip
Strips whitespace from the left side of a string
Example
Input
{{ " hello " | lstrip }}
Output
"hello "
rstrip
Strips whitespace from the right side of a string
Example
Input
{{ " hello " | rstrip }}
Output
" hello"
map
Select/map a given property from an associative array (hash)
Example
Input
{{ blogs | map:'title' | join:', ' }}
Output
Videos, Feature, Roadmap, FAQ, Features, Guides, Tech questions, Docs, Change log, eCommerce guides
newline_to_br
Example
Input
{{ "I have a multiline string!\nThat I want to output in html\n" | newline_to_br }}
Output
I have a multiline string!
That I want to output in html
pluralize
Returns the second word if the input is not 1
Example
Input
{{ 2 | pluralize: 'car', 'cars' }}
Output
cars
prepend
Prepend a string
Example
Input
{{ 'world' | prepend:'hello ' }}
Output
hello world
remove_first
Remove the first occurrence
Example
Input
{{ 'Clean tetest!' | remove_first:'te' }}
Output
Clean test!
remove
Remove each occurrence
Example
Input
{{ 'foobarfoo' | remove:'foo' }}
Output
bar
replace_first
Replaces the first occurrence
Example
Input
{{ 'barbar' | replace_first:'bar','foo' }}
Output
foobar
replace
Example
Input
{{ 'foofoo' | replace:'foo','bar' }}
Output
barbar
reverse
Reverses an array
Example
Input
{% assign abc = "a,b,c" | split: "," %} {{ abc | reverse }}
Output
cba
size
Returns the length of an array or string
Example, string
Input
{{ "what is the size of this" | size }}
Output
24
It is also possible to check for the size in an if
statement
{% if article.excerpt.size > 0 %} {{ article.excerpt | strip_html }} {% endif %}
slice
Slice an array or string using an offset and a length
Example
Input
{{ "hello world" | slice: 1, 3 }}
Output
ell
sort
Sorts array elements in alphabetical order
Example
Input
{% assign fruit = "Banana,Date,Ananas,Citrus" | split: "," %} {{ fruit | sort | join:', ' }}
Output
Ananas, Banana, Citrus, Date
split
Returns an array by spliting a string on a matching separator
Example
Input
{% let a = "a,b,c,d" | split:"," %}
Output
[ "a", "b", "c", "d" ]
strip_html
Strip HTML from string
Example
Input
{{ "Testing" | strip_html }}
Output
Testing
strip_newlines
Strips all newlines \n
from strings
Example
Input
{{ "Lorem\n ipsum\n dolor\n sit\n amet" | strip_newlines }}
Output
Lorem ipsum dolor sit amet
truncate
Truncates a string to number of characters with optional ellipsis parameter. Note that the ellipsis characters are counted into the amount or characters.
Example, truncates to 16 characters in total with
...
in the end.Input
{{ 'this is to long for me' | truncate: 16,'...' }}
Output
this is to lo...
Example, truncates to 4 characters ending with
!
.Input
{{ '1234567890' | truncate: 4,'!' }}
Output
123!
Example, with empty ellipsis
Input
{{ '1234567890' | truncate: 4,'' }}
Output
1234
truncatewords
Truncates a string to number of words with optional ellipsis parameter
<string> | truncatewords:<int number> [, <string ellipsis, default '...'> ]
Example, one word and default ellipsis
Input
{{ 'hello world' | truncatewords:1 }}
Output
hello...
Example, four words and empty ellipsis
Input
{{ 'Lorem ipsum dolor sit amet.' | truncatewords:4, '' }}
Output
Lorem ipsum dolor sit
uniq
Removes duplicates from an array, optionally using a property parameter, like price, to test with, uniq:'price'
Example
Input
{% let duplicates = "a,a,b,b,e,e,e,c,d" | split:"," %} {{ duplicates | uniq }}
Output
a,b,e,c,d
upcase
Converts string or array input to uppercase
Example
Input
{{ 'WasCamelCased' | upcase }}
Output
WASCAMELCASED
Example
Input
{% assign fruit = "Banana,Date,Ananas,Citrus" | split: "," %} {{ fruit | upcase }}
Output
[BANANA DATE ANANAS CITRUS]