Additional Filters

Supportbench knowledgebase team

29-Oct-2015

General filters serve many different purposes including formatting, converting, and applying CSS classes.

• date
• default
• default_errors
• default_pagination
• highlight
• highlight_active_tag
• json
• weight_with_unit

date

Converts a timestamp into another date format.

Input

{{ article.published_at | date: "%a, %b %d, %y" }}

Output

Tue, Apr 22, 14

The date parameters are listed below:

%a

{{ article.published_at | date: "%a" }}
<!-- Sat -->

%A

{{ article.published_at | date: "%A" }}
<!-- Tuesday -->

%b

{{ article.published_at | date: "%b" }}
<!-- Jan -->

%B

{{ article.published_at | date: "%B" }}
<!-- January -->

%c

{{ article.published_at | date: "%c" }}
<!-- Tue Apr 22 11:16:09 2014 -->

%d

{{ article.published_at | date: "%d" }}
<!-- 04 -->

%-d

{{ article.published_at | date: "%-d" }}
<!-- 4 -->

%D

{{ article.published_at | date: "%D" }}
<!-- 04/22/14 -->

%e

{{ article.published_at | date: "%e" }}
<!-- 3 -->

%F

{{ article.published_at | date: "%F" }}
<!-- 2014-04-22 -->

%H

{{ article.published_at | date: "%H" }}
<!-- 15 -->

%I

{{ article.published_at | date: "%I" }}
<!-- 7 -->

%j

{{ article.published_at | date: "%j" }}
<!-- 245 -->

%k

{{ article.published_at | date: "%k" }}
<!-- 14 -->

%m

{{ article.published_at | date: "%m" }}
<!-- 04 -->

%M

{{ article.published_at | date: "%M" }}
<!--53-->

%p

{{ article.published_at | date: "%p" }}
<!-- PM -->

%r

{{ article.published_at | date: "%r" }}
<!-- 03:20:07 PM -->

%R

{{ article.published_at | date: "%R" }}
<!-- 15:21 -->

%T

{{ article.published_at | date: "%T" }}
<!-- 15:22:13 -->

%U

{{ article.published_at | date: "%U" }}
<!-- 16 -->

%W

{{ article.published_at | date: "%W" }}
<!-- 16 -->

%w

{{ article.published_at | date: "%w" }}
<!-- 2 -->

%x

{{ article.published_at | date: "%x" }}
<!-- 04/22/14 -->

%X

{{ article.published_at | date: "%X" }}
<!-- 13:17:24 -->

%y

{{ article.published_at | date: "%y" }}
<!-- 14 -->

%Y

{{ article.published_at | date: "%Y" }}
<!-- 2014 -->

%Z

{{ article.published_at | date: "%Z" }}
<!-- EDT -->

default

Sets a default value for any variable with no assigned value. Can be used with strings, arrays, and hashes.

Input

Dear {{ customer.name | default: "customer" }}

Output

<!-- if customer.name is nil -->
Dear customer

default_errors

Outputs default error messages for the form.errors variable. The messages returned are dependent on the strings returned by form.errors.

Input

{% if form.errors %}
 {{ form.errors | default_errors }}
{% endif %}

Output

<!-- if form.errors returned "email" -->
Please enter a valid email address.

default_pagination

Creates a set of links for paginated results. Used in conjunction with the paginate variable.

Input

{{ paginate | default_pagination }}

Output

<span class="page current">1</span>
<span class="page"><a href="/collections/all?page=2" title="">2</a></span>
<span class="page"><a href="/collections/all?page=3" title="">3</a></span>
<span class="deco">&hellip;</span>
<span class="page"><a href="/collections/all?page=17" title="">17</a></span>
<span class="next"><a href="/collections/all?page=2" title="">Next &raquo;</a></span>

highlight

Wraps words inside search results with an HTML <strong> tag with the class highlight if it matches the submitted search.terms.

Input

{{ item.content | highlight: search.terms }}

Output

<!-- If the search term was "Yellow" -->
<strong class="highlight">Yellow</strong> shirts are the best!

highlight_active_tag

Wraps a tag link in a <span> with the class active if that tag is being used to filter a collection.

Input

<!-- collection.tags = ["Cotton", "Crew Neck", "Jersey"] -->
{% for tag in collection.tags %}
 {{ tag | highlight_active | link_to_tag: tag }}
{% endfor %}

Output

<a title="Show products matching tag Cotton" href="/collections/all/cotton"><span class="active">Cotton</span></a>
<a title="Show products matching tag Crew Neck" href="/collections/all/crew-neck">Crew Neck</a>
<a title="Show products matching tag Jersey" href="/collections/all/jersey">Jersey</a>

json

Converts a string into JSON format.

Input

var content = {{ pages.page-handle.content | json }};

Output

var content = "\u003Cp\u003E\u003Cstrong\u003EYou made it! Congratulations on starting your own e-commerce store!\u003C/strong\u003E\u003C/p\u003E\n\u003Cp\u003EThis is your shop\u0026#8217;s \u003Cstrong\u003Efrontpage\u003C/strong\u003E, and it\u0026#8217;s the first thing your customers will see when they arrive. You\u0026#8217;ll be able to organize and style this page however you like.\u003C/p\u003E\n\u003Cp\u003E\u003Cstrong\u003ETo get started adding products to your shop, head over to the \u003Ca href=\"/admin\"\u003EAdmin Area\u003C/a\u003E.\u003C/strong\u003E\u003C/p\u003E\n\u003Cp\u003EEnjoy the software, \u003Cbr /\u003E\nYour supportbench Team.\u003C/p\u003E";

Information

You do not have to wrap the Liquid output in quotations - the json filter will add them in. The jsonfilter will also escape quotes as needed inside the output.

The json filter can also used to make Liquid objects readable by JavaScript:

var json_product = {{ collections.featured.products.first | json }};
var json_cart = {{ cart | json }};

weight_with_unit

Formats the product variant's weight. The weight unit is set in General Settings.

Input

{{ product.variants.first.weight | weight_with_unit }}

Output

24.0 kg

The unit can be overridden by passing it into the filter. This is useful in the case of product variants which can each have their own unit.

Input

{{ variant.weight | weight_with_unit: variant.weight_unit }}

Output

52.9 lb