String filters are used to manipulate outputs and variables of the string type.
Appends characters to a string.
Input
{{ 'sales' | append: '.jpg' }}
Output
sales.jpg
Converts a string into CamelCase.
{{ 'coming-soon' | camelcase }}
ComingSoon
Capitalizes the first word in a string
{{ 'capitalize me' | capitalize }}
Capitalize me
Converts a string into lowercase.
{{ 'UPPERCASE' | downcase }}
uppercase
Escapes a string.
{{ "<p>test</p>" | escape }}
<!-- The <p> tags are not rendered --> <p>test</p>
Formats a string into a handle.
{{ '100% M & Ms!!!' | handleize }}
100-m-ms
Converts a string into an MD5 hash.
An example use case for this filter is showing the Gravatar image associated with the poster of a blog comment:
<img src="https://www.gravatar.com/avatar/{{ comment.email | remove: ' ' | strip_newlines | downcase | md5 }}" />
<img src="https://www.gravatar.com/avatar/2a95ab7c950db9693c2ceb767784c201" />
Inserts a <br > linebreak HTML tag in front of each line break in a string.
{% capture var %} One Two Three {% endcapture %} {{ var | newline_to_br }}
One <br> Two<br> Three<br>
Outputs the singular or plural version of a string based on the value of a number. The first parameter is the singular string and the second parameter is the plural string.
{{ cart.item_count }} {{ cart.item_count | pluralize: 'item', 'items' }}
3 items
Prepends characters to a string.
{{ 'sale' | prepend: 'Made a great ' }}
Made a great sale
Removes all occurrences of a substring from a string.
{{ "Hello, world. Goodbye, world." | remove: "world" }}
Hello, . Goodbye, .
Removes only the first occurrence of a substring from a string.
{{ "Hello, world. Goodbye, world." | remove_first: "world" }}
Hello, . Goodbye, world.
Replaces all occurrences of a string with a substring.
<!-- product.title = "Awesome Shoes" --> {{ product.title | replace: 'Awesome', 'Mega' }}
Mega Shoes
Replaces the first occurrence of a string with a substring.
<!-- product.title = "Awesome Awesome Shoes" --> {{ product.title | replace_first: 'Awesome', 'Mega' }}
Mega Awesome Shoes
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.
slice
{{ "hello" | slice: 0 }} {{ "hello" | slice: 1 }} {{ "hello" | slice: 1, 3 }}
h e ell
If the passed index is negative, it is counted from the end of the string.
{{ "hello" | slice: -3, 2 }}
ll
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.
split
{% assign words = "Hi, how are you today?" | split: ' ' %} {% for word in words %} {{ word }} {% endfor %}
Hi, how are you today?
Strips tabs, spaces, and newlines (all whitespace) from the left and right side of a string.
{{ ' too many spaces ' | strip }}
too many spaces
Strips tabs, spaces, and newlines (all whitespace) from the left side of a string.
"{{ ' too many spaces ' | lstrip }}"
<!-- Notice the empty spaces to the right of the string --> too many spaces
Strips tabs, spaces, and newlines (all whitespace) from the right side of a string.
{{ ' too many spaces ' | rstrip }}
Strips all HTML tags from a string.
{{ "<h1>Hello</h1> World" | strip_html }}
Hello World
Removes any line breaks/newlines from a string.
{{ product.description | strip_newlines }}
Truncates a string down to 'x' characters, where x is the number passed as a parameter. An ellipsis (...) is appended to the string and is included in the character count.
{{ "The cat came back the very next day" | truncate: 10 }}
The cat...
Truncates a string down to 'x' words, where x is the number passed as a parameter. An ellipsis (...) is appended to the truncated string.
{{ "The cat came back the very next day" | truncatewords: 4 }}
The cat came back...
Removes any duplicate instances of an element in an array.
{% assign fruits = "orange apple banana apple orange" %} {{ fruits | split: ' ' | uniq | join: ' ' }}
orange apple banana
Converts a string into uppercase.
{{ 'i want this to be uppercase' | upcase }}
I WANT THIS TO BE UPPERCASE
Identifies all characters in a string that are not allowed in URLS, and replaces the characters with their escaped variants.
{{ "<hello> & <supportbench>" | url_escape }}
%3Chello%3E%20&%20%3Csupportbench%3E
Replaces all characters in a string that are not allowed in URLs with their escaped variants, including the ampersand (&).
{{ "<hello> & <supportbench>" | url_param_escape }}
%3Chello%3E%20%26%20%3Csupportbench%3E
Was this article helpfu?
Thank you for voting
You are related to multiple companies. Please select the company you wish to login as.