Search the docs for APIs, endpoints or guides.
Can't find what you're looking for?
Ask in the community.
Endpoints
Articles
Filters affect the ultimate output of your HubL. They can be applied to various HubL statements and expressions to alter the template markup outputted by the server.
The basic syntax of a filter is
|filtername
. The filter is added directly following the statement or the expression, within its delimiters. Some filters have additional parameters that can be added in parentheses. The basic syntax of a filter with a string, a number, and a boolean parameters is:
|filtername("stringParameter", 10, true)
. Notice that string parameters should be written in quotes. Also note that HubL filters have an alias that can be used to serve the same purpose as the primary filter.
The following article contains all of the supported HubL filters.
{% set begin = "2018-07-14T14:31:30+0530"|strtotime("yyyy-MM-dd'T'HH:mm:ssZ") %}
{% set end = "2018-07-20T14:31:30+0530"|strtotime("yyyy-MM-dd'T'HH:mm:ssZ") %}
{{ begin|between_times(end, "days") }}
6
before{{ var|center(80) }}after
</pre>
<pre>
before string to center after
{{ my_color|convert_rgb }}
{% color "my_color" color="#000000", export_to_template_context=True %}
<div style="background: rgba({{ widget_data.my_color.color|convert_rgb }}, .5)"></div>
255, 255, 255
<div style="background: rgba(0, 0, 0, .5)"></div>
If the value is undefined it will return the first parameter, otherwise the value of the variable will be printed. If you want to use default with variables that evaluate to false, you have to set the second parameter to
true
. The first example below would print the message if the variable is not defined. The second example applied the filter to an empty string, which is not undefined, but it prints a message due to the second parameter.
{{ my_variable|default("my_variable is not defined") }}
{{ ""|default("the string was empty", true) }}
my_variable is not defined
the string was empty
Sort a dict and yield (key, value) pairs. Dictionaries are unsorted by default, but you can print a dictionary, sorted by key or value. The first parameter is a boolean to determine, whether or not the sorting is case sensitive. The second parameter determines whether to sort the dict by key or value. The example below prints a sorted contact dictionary, with all the known details about the contact.
Escapes the content of an HTML attribute input. Accepts a string and converts the characters
&
,
<
,
‘
,
”
, and
escape_jinjava
into HTML-safe sequences. Use this filter for HubL variables that are being added to HTML attributes.
Note that when escaping values of attributes that accept URLs, such as
href
, you should use the
escape_url
filter instead.
{% set escape_string = "\tThey said 'This string can safely be inserted into JavaScript.'" %}
{{ escape_string|escape_js }}
\tThey said \x27This string can safely be inserted into JavaScript.\x27
{% set escape_string = "<script>alert('oh no!')</script>" %}
{% require_js position="head" %}
<script data-search_input-config="config_{{ name }}" type="application/json">
"autosuggest_results_message": "{{ escape_string|escapejson }}"
</script>
{% end_require_js %}
<script data-search_input-config="config_widget_1234567" type="application/json">
"autosuggest_results_message": "<script>alert('oh no!')<\/script>"
</script>
{{ content.publish_date | format_date('long') }}
{{ content.publish_date | format_date('yyyyy.MMMM.dd') }}
{{ content.publish_date | format_date('medium', 'America/New_York', 'de-DE') }}
November 28, 2022
02022.November.28
28.11.2022
{{ content.updated | format_time('long') }}
{{ content.updated | format_time('hh:mm a') }}
{{ content.updated | format_time('medium', 'America/New_York', 'de-DE') }}
3:25:06 PM Z
03:25 PM
10:25:44
the HubDB Location =
42.3667, -71.1060 (Cambridge, MA) |
Chicago, IL = 37.3435, -122.0344 -->
{{ row.location | geo_distance(37.3435, -122.0344, "mi") }} MI
861.1655563461395 MI
The indent filter uses whitespace to indent text within a given field length. This filter is not recommended or particularly useful since HubSpot's HTML compiler will automatically strip out the white space; however, it is included here for the sake of comprehensiveness. The example below shows a center filter being applied to a variable in a pre tag, so the whitespace isn't stripped out. The first parameter controls the amount of whitespace and the second boolean toggles whether to indent the first line.
{% set three = 3 %}
{% set four = ["four"] %}
{% set list_num = one|list + two|list + three|list + four|list %}
{{ list_num }}
[1,2,3]
Applies a filter on a sequence of objects or looks up an attribute. This is useful when dealing with lists of objects but you are really only interested in a certain value of it.
The basic usage is mapping on an attribute. For example, if you want to use conditional logic to check if a value is present in a particular attribute of a dict. Alternatively, you can let it invoke a filter by passing the name of the filter and the arguments afterwards.
{% set seq = ["item1", "item2", "item3"] %}
{{ seq|map("upper") }}
{{ content|map("currentState")}}
[ITEM1, ITEM2, ITEM3]
DRAFT
{% set date = "2018-07-14T14:31:30+0530"|strtotime("yyyy-MM-dd'T'HH:mm:ssZ") %}
{{ date }}
{{ date|minus_time(2, "months") }}
2018-07-14 14:31:30
2018-05-14 14:31:30
{% set date = "2018-07-14T14:31:30+0530"|strtotime("yyyy-MM-dd'T'HH:mm:ssZ") %}
{{ date }}
{{ date|plus_time(5, "days") }}
2018-07-14 14:31:30
2018-07-19 14:31:30
Please note:
when using this filter, the page will be
prerendered
periodically rather than every time the page content is updated. This means that the filtered content will
not
be updated on every page reload.
This may not be an issue for certain types of content, such as displaying a random list of blog posts. However, if you need content to change randomly on every page load, you should instead use JavaScript to randomize the content client-side.
Searches for a regex pattern and replaces with a sequence of characters. The first argument is a RE2-style regex pattern, the second is the replacement string.
Information on the RE2 regex syntax can be found
here
.
{% for content in contents|rejectattr("post_list_summary_featured_image") %}
<div class="post-item">
{% if content.post_list_summary_featured_image %}
<div class="hs-featured-image-wrapper">
<a href="{{content.absolute_url}}" title="" class="hs-featured-image-link">
<img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image">
{% endif %}
{{ content.post_list_content|safe }}
{% endfor %}
<div class="post-item">Post with no featured image</div>
<div class="post-item">Post with no featured image</div>
<div class="post-item">Post with no featured image</div>
{% if topic %}
<h3>Posts about {{ page_meta.html_title|replace("Blog | ", "") }}</h3>
{% endif %}
<h3>Posts about topic name</h3>
Optional
Options include
common
round either up or down (default);
ceil
always rounds up;
floor
always rounds down.
If you don’t specify a method
common
is used.
Sanitizes the content of an HTML input for the output of rich text content. Accepts a string, then strips HTML tags that are not allowed. Use this filter for HubL variables that are used in HTML that should allow safe HTML.
When using this filter, you can include the following parameters for allowing specific types of HTML tags:
FORMATTING
,
BLOCKS
,
STYLES
,
LINKS
,
TABLES
,
IMAGES
. For example,
sanitize_html(IMAGES)
.
Using
sanitize_html
will include all parameters in the filter.
You can also include a
STRIP
parameter to strip
all
HTML. All content is run through
escape_jinjava
as well to prevent nested interpretation.
{% set escape_string = "This <br> <div>markup is <img src='test.com/image'> <span>printed</span> as text.</div>" %}
{{ escape_string|sanitize_html("IMAGES") }}
This markup is <img src="test.com/image"> printed as text.</div>
