HubL Reference

Table of contents
Close

Operators & expression tests

In order to expand the logic and functionality of your templates, HubL supports several key operators and expression tests. The operators allow you to execute math functions, make comparisons, complicate template logic, and alter what markup renders. In addition, this article contains a comprehensive list of expression tests that can be used in HubL .

Operators

Operators are symbols that tell the HubL compiler to execute various operations that result in the final outputted markup. The following section includes a list of all of the supported HubL operators.

Math

Standard math operators can be used to calculate values in the context of a template.

SymbolDescription
+  Adds two objects together. You will generaly use this for addition of numbers. If you are trying to concatenate strings of lists, you should use ~ instead.
-  Subtracts one number from another.
/  Divides numbers
%  Returns the remainder from dividing numbers
*  Multiplies numbers

{% set my_num = 11 %}
{% set my_number = 2 %}
    
{{ my_num + my_number }}
{{ my_num - my_number }}
{{ my_num / my_number }}
{{ my_num % my_number }}
{{ my_num * my_number }}


13
9
5.5
1
22

Comparison

Comparison operators can be used to evaluate values for template logic. You can see some examples of comparison operators being used on if statements here

SymbolDescription
==  Evaluates to true, if two objects are equal. 
!= Evaluates to true, if two objects are not equal.
> Evaluates to true, if the left hand side is greater than the right hand side.
>= Evaluates to true, if the left hand side is greater or equal to the right hand side.
< Evaluates to true, if the left hand side is lower than the right hand side.
<= Evaluates to true, if the left hand side is lower or equal to the right hand side.

Logical

Logical operators allow you to combine multiple expressions into single statements.

SymbolDescription
and  Return true if the left and the right operand are true.
or  Return true if the left or the right operand are true.
not  Negates a statement and is used in conjunction with is. See examples below.
(expr)  Group an expression for the order of operations. For example, (10 - 2) * variable. 

Other HubL operators

 Below are other important HubL operators that can be used to perform various tasks. 

Symbol Description
in  Checks to see if a value is in a sequence.
is  Performs an expression test.
|  Applies a filter.
~  Concatenates values.

Expression tests

Expression tests are various boolean conditions that can be evaluated by using logical operators.

defined

The defined expression test checks to see whether a variable is defined within the context of the template. While you can use this expression test, writing an if statement without any operators will default to checking whether or not the variable is defined.

In the example below, a color module's color parameter is tested. If the color parameter had no value, the template would render a default black background color. If it is defined, it renders the background color set by the user.


{% color "my_color" color='#930101', export_to_template_context=True %}

<style>
{% if widget_data.my_color.color is defined %}
body{
background: {{ widget_data.my_color.color }};
}
{% else %}
body{
background: #000;
}
{% endif %}
</style>


<style>
    body{
        background: #930101;
        }
</style> 

divisibleby

The expression test divisibleby can be used to test whether an object is divisible by another number.

For example, below a for loop is created that iterates through a list of types of animals. Each type of animal gets printed in a div, and every 5th div has different inline styling applied (width:100%). This concept could be applied to blog where different markup is rendered for a certain pattern of posts. To learn more about for loops and loop.index, check out this article


{% set animals = ['lions', 'tigers', 'bears', 'dogs', 'sharks'] %} 
{% for animal in animals %} 
 
{% if loop.index is divisibleby 5 %}
<div style="width:100%">{{animal}}</div> 
{% else %}
<div style="width:25%">{{animal}}</div> 
{% endif %}
 
{% endfor %}


<div style="width:25%">lions</div> 
<div style="width:25%">tigers</div> 
<div style="width:25%">bears</div> 
<div style="width:25%">dogs</div> 
<div style="width:100%">sharks</div> 

equalto

The equalto expression test checks to see if a variable's value is equal to a constant or another variable. You can also use the operator == to do the same test.

In the example below, the width of the blog posts is adjusted based on the total number of posts in the loop. The example output assumes there were 4 posts in the blog. 


{% for content in contents %}
    {% if loop.length is equalto 2 %}
        <div style="width:50%;">Post content</div>
    {% elif loop.length is equalto 3 %}  
        <div style="width:33.333332%;">Post content</div>
    {% elif loop.length is equalto 4 %}  
        <div style="width:25%;">Post content</div>    
    {% else %}
        <div style="width:100%;>Post content</div>
    {% endif %}
{% endfor %}    

<div style="width:25%;">Post content</div> <div style="width:25%;">Post content</div> <div style="width:25%;">Post content</div> <div style="width:25%;">Post content</div>



even

The even expression test checks to see whether a numeric variable is an even number. 

The example below shows a simplified blog listing loop, where if the current iteration of the loop is even, a class of even-post is assigned to the post item div. Otherwise a calss of odd-post is assigned. 


{% for content in contents %}
   {% if loop.index is even %}
        <div class="post-item even-post">Post content</div>
    {% else %}
        <div class="post-item odd-post">Post content</div>
    {% endif %}
{% endfor %}    

<div class="post-item odd-post">Post content</div> <div class="post-item even-post">Post content</div> <div class="post-item odd-post">Post content</div> <div class="post-item even-post">Post content</div>



iterable

Checks to see whether a variable is iterable and can be looped through.

This example checks a variable called "jobs" to see if it can be iterated through. Since the variable contains a list of jobs, the if statement would evaluate to true, and the loop would run. If the variable had contained a single value, the if statement would print that value with different markup instead. You can learn more about for loops here


{% set jobs = ['Accountant', 'Developer', 'Manager', 'Marketing', 'Support'] %} 
{% if jobs is iterable %}
<h3>Available positions</h3>
<ul>
{% for job in jobs %}
    <li>{{ job }}</li>
{% endfor %}
</ul>
{% else %}
<h3>Available position</h3>
    <div class="single-position">{{ jobs }}</div>
{% endif %}


<h3>Available positions</h3>
<ul>
    <li>Accountant</li>
    <li>Developer</li>
    <li>Manager</li>
    <li>Marketing</li>
    <li>Support</li>
</ul>

lower

The lower expression test evaluates to true when an string is lowercase. 

The example below uses an unless statement and a lower filter to ensure that a string of text entered into a text module is always lowercase.


{% text "my_text" label='Enter text', value='Some TEXT that should be Lowercase', export_to_template_context=True %}

{% unless widget_data.my_text.value is lower %}
{{ widget_data.my_text.value|lower }}
{% endunless %}


some text that should be lowercase

mapping

The mapping expression test checks to see whether or not an object is a dict (dictionary). 

The example below is checking to see if the contact object is a dictionary, in which case it is. 


{% if contact is mapping %}
This object is a dictionary.
{% else %}
This object is not a dictionary.
{% endif %}


This object is a dictionary.

none

The none expression test checks to see whether a variable has a null value. 


{% text "user_email" label='Enter user email', value='example@hubspot.com', export_to_template_context=True %}
{% unless widget_data.user_email.value is none %}
{{ widget_data.user_email.value }}
{% endunless %}


example@hubspot.com

number

The number expression test check to see whether or not the value of a variable is a number.

The example below checks a variable to see whether or not it is a variable, and if so it converts it into millions.


{% set my_var = 40 %}
{% if my_var is number %}
{{ my_var * 1000000 }}
{% else %}
my_var is not a number.
{% endif %}


40000000

odd

The odd expression test checks to see whether a numeric variable is an odd number. 

Below is the same example as the inverse even expression test previously described. 


{% for content in contents %}
   {% if loop.index is odd %}
        <div class="post-item odd-post">Post content</div>
    {% else %}
        <div class="post-item even-post">Post content</div>
    {% endif %}
{% endfor %}    


<div class="post-item odd-post">Post content</div>
<div class="post-item even-post">Post content</div>
 <div class="post-item odd-post">Post content</div>
<div class="post-item even-post">Post content</div>

sameas

The sameas expression test checks to see whether or not two variables have the same value. 

The example below, sets two variables and then checks to see whether or not they are the same.


{% set var_one = True %}
{% set var_two = True %}
{% if var_one is sameas var_two  %}
The variables values are the same.
{% else %}
The variables values are different.
{% endif %}


The variables values are the same.

sequence

The sequence expression test is simialr to the iterable test, in that it checks to see whether or not a variable is a sequence.  

The example below checks whether a variable is a sequence and then iterates through that sequence of musical genres.


{% set genres = ['Pop', 'Rock', 'Disco', 'Funk', 'Folk', 'Metal', 'Jazz', 'Country', 'Hip-Hop', 'Classical', 'Soul', 'Electronica' ] %} 
{% if genres is sequence %}
<h3>Favorite genres</h3>
<ul>
{% for genre in genres %}
    <li>{{ genre }}</li>
{% endfor %}
</ul>
{% else %}
<h3>Favorite genre:</h3>
    <div class='single-genre'>{{ genres }}</div>
{% endif %}


<ul>
    <li>Pop</li>
    <li>Rock</li>
    <li>Disco</li>
    <li>Funk</li>
    <li>Folk</li>
    <li>Metal</li>
    <li>Jazz</li>
    <li>Country</li>
    <li>Hip-Hop</li>
    <li>Classical</li>
    <li>Soul</li>
    <li>Electronica</li>
</ul>

string

The string expression test check to see whether the value stored in a variable is text. 

The example below checks whether or not a variable is a string, and if so it applies a title filter to change the capitalization. 


{% set my_var = "title of section" %}
{% if my_var is string %}
{{ my_var|title }}
{% else %}
my_var is not a string
{% endif %}


Title Of Section

string_containing

This test checks to see if a string is contained within another string. This expression test is used in conjunction with the "is" operator.

{% if content.domain is string_containing ".es" %}
Markup that will only render on content hosted on .es domains
{% elif content.domain is string_containing ".jp" %}
Markup that will only render on content hosted on .jp domains
{% else %}
Markup that will render on all other domains
{% endif %}


Markup that will render on all other domains

string_startingwith

This expression test checks to see if a string starts with a particular string. It is used in conjunction with the "is" operator.


{% if content.slug is string_startingwith "es/" %}
Markup that will only render on content hosted in a /es/ subdirectory
{% elif content.slug is string_startingwith "jp/" %}
Markup that will only render on content hosted in a /jp/ subdirectory
{% else %}
Markup that will render on all subdirectories
{% endif %}


Markup that will render on all subdirectories

truthy

The truthy expression test checks to see whether a boolean variable value is True. 

The example below uses a boolean checkbox module to display an alert message.


{% boolean "check_box" label='Show alert', value=True, export_to_template_context=True %}

{% if widget_data.check_box.value is truthy %}
<div class='alert'>Danger!</div>
{% endif %}


<div class='alert'>Danger!</div>

undefined

The undefined expression test checks to see whether a variable is undefined in the context of the template. This test is different than none, in that undefined will be true when the variable is present but has no value; whereas, none will be true when the variable has a null value.  

The example below checks a template for the existence of the variable "my_var". 


{% if my_var is undefined %}
A variable named "my_var" does not exist on this template.
{% else %}
{{ my_var }}
{% endif %}


A variable named "my_var" does not exist on this template.

upper

The upper expression test evaluates to true when an string is all uppercase. Below is an inverse example of the lower expression test above.


{% text "my_text" label='Enter text', value='Some TEXT that should be Uppercase', export_to_template_context=True %}

{% unless widget_data.my_text.value is upper %}
{{ widget_data.my_text.value|upper }}
{% endunless %}


SOME TEXT THAT SHOULD BE UPPERCASE