String filters
String filters are used to manipulate outputs and variables of the string type.
append
Appends characters to a string.
{{ 'sales' | append: '.jpg' }}
sales.jpg
camelcase
Converts a string into CamelCase.
{{ 'coming-soon' | camelcase }}
ComingSoon
capitalize
{{ 'capitalize me' | capitalize }}
Capitalize me
downcase
Converts a string into lowercase.
{{ 'UPPERCASE' | downcase }}
uppercase
escape
Escapes a string.
{{ "<p>test</p>" | escape }}
<p>test</p>
<!-- Note: a browser will visually display this as <p>test</p> -->
prepend
Prepends characters to a string.
{{ 'sale' | prepend: 'Made a great ' }}
Made a great sale
remove
Removes all occurrences of a substring from a string.
{{ "Hello, world. Goodbye, world." | remove: "world" }}
Hello, . Goodbye, .
remove_first
Removes only the first occurrence of a substring from a string.
{{ "Hello, world. Goodbye, world." | remove_first: "world" }}
Hello, . Goodbye, world.
replace
Replaces all occurrences of a string with a substring.
<!-- product.title = "Awesome Shoes" -->
{{ product.title | replace: 'Awesome', 'Mega' }}
Mega Shoes
replace_first
Replaces the first occurrence of a string with a substring.
<!-- product.title = "Awesome Awesome Shoes" -->
{{ product.title | replace_first: 'Awesome', 'Mega' }}
Mega Awesome Shoes
slice
The slice
filter returns a substring, starting at the specified index. An optional second parameter can be passed to specify the length of the substring. If no second parameter is given, a substring of one character will be returned.
{{ "hello" | slice: 0 }}
{{ "hello" | slice: 1 }}
{{ "hello" | slice: 1, 3 }}
h
e
ell
split
The split
filter takes on a substring as a parameter. The substring is used as a delimiter to divide a string into an array. You can output different parts of an array using array filters.
{% assign words = "Hi, how are you today?" | split: ' ' %}
{% for word in words %}
{{ word }}
{% endfor %}
Hi,
how
are
you
today?
strip
Strips tabs, spaces, and newlines (all whitespace) from the left and right side of a string.
{{ ' too many spaces ' | strip }}
too many spaces
lstrip
Strips tabs, spaces, and newlines (all whitespace) from the left side of a string.
{{ ' too many spaces ' | lstrip }}
<!-- Highlight to see the empty spaces to the right of the string -->
too many spaces
rstrip
Strips tabs, spaces, and newlines (all whitespace) from the right side of a string.
{{ ' too many spaces ' | rstrip }}
<!-- Notice the empty spaces to the left of the string -->
too many spaces
strip_html
Strips all HTML tags from a string.
{{ "<h1>Hello</h1> World" | strip_html }}
Hello World
strip_newlines
Removes any line breaks/newlines from a string.
{{ product.description | strip_newlines }}
truncate
Truncates a string down to the number of characters passed as the first parameter. An ellipsis (...) is appended to the truncated string and is included in the character count.
{{ "The cat came back the very next day" | truncate: 13 }}
The cat ca...
truncatewords
Truncates a string down to the number of words passed as the first parameter. An ellipsis (...) is appended to the truncated string.
{{ "The cat came back the very next day" | truncatewords: 4 }}
The cat came back...
upcase
Converts a string into uppercase.
{{ 'i want this to be uppercase' | upcase }}
I WANT THIS TO BE UPPERCASE
url_encode
Converts any URL-unsafe characters in a string into percent-encoded characters.
{{ "[email protected]" | url_encode }}
john%40liquid.com
Reversing strings
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 other filters:
{{ "Ground control to Major Tom." | split: "" | reverse | join: "" }}
.moT rojaM ot lortnoc dnuorG
Updated about 3 years ago