🔍 Search the page to quickly find the documentation you need. Read FAQ.

HubL Templating Language

Variables

Other Reference

HubL Filters

HubL Functions

HubL Tags

HubSpot Default Modules

HubSpot Module and Theme fields

Custom Module Boilerplate

How to create a custom module
Created by Jake Lett

Frequently Asked Questions about HubL

What are modules in HubL and how can they be customized?

Modules in HubL are dynamic areas within a template that can be easily customized by the end user using the content editor. They offer a way for content creators to add, edit, and modify specific sections of a page without the need for coding skills. When creating a template, modules are added using HubL tags, allowing the content creators the flexibility to make changes as needed.

To define a module, several components are required. Firstly, the type of module needs to be specified, which determines how the module will be rendered. HubSpot provides various types of modules, and a comprehensive list can be found on the HubL Supported Tags page. Each module is given a unique name to identify it within the template.

The path is another component of a module, which defines its location within the design manager. For default HubSpot modules, the path should always start with "@hubspot/" followed by the module type.

Additionally, modules can have parameters, which are used to specify additional information about the module. These parameters can enhance the functionality of the module and provide further customization options.

Overall, modules in HubL are versatile tools that empower content creators to customize specific areas of a template without relying on coding expertise. Using HubL tags, modules can be added, named, located, and customized to suit the needs of a website or page.

What is HubL and how does it relate to Jinja?

HubL, also known as HubSpot Markup Language, is a specialized templating language used in HubSpot's CMS. It is built as an extension of Jinjava, which is a widely used templating engine based on Jinja. While Jinjava offers a comprehensive range of features, HubL introduces additional markup elements that are specific to the HubSpot platform. Consequently, HubL does not support all the functionalities provided by Jinja. In essence, HubL is a modified version of Jinjava tailored to meet the specific needs and requirements of the HubSpot CMS.

How does the 'do' tag work in HubL?

The 'do' tag in HubL functions similarly to regular statements denoted by {% ... %}. It provides the ability to modify lists and dictionaries within the HubL language. When using the 'do' tag to add elements to an array, the appropriate method to employ is .append(). On the other hand, when aiming to add elements to an object, the recommended approach is to utilize .update(). In summary, the 'do' tag in HubL is a powerful tool that allows for manipulation and modification of data structures within HubL templates.

What is HubL?

HubL is HubSpot's proprietary templating language that allows developers to create dynamic and personalized web experiences within the HubSpot CMS. It's based on Jinja2 and provides a way to interact with HubSpot's data and functionalities within your website templates.

How does HubL differ from HTML?

While HTML structures the content of a web page, HubL adds the dynamic layer. You use HubL to fetch and display data from HubSpot, create conditional logic, loop through content, and much more. Think of HTML as the skeleton and HubL as the muscles and nervous system that bring it to life.

Where can I find the official HubL documentation?

You can find the official HubSpot HubL documentation at [link to official HubSpot HubL docs]. It's always the best resource for the most up-to-date information.

What are some common HubL functions?

Some frequently used HubL functions include {{ content.field_name }} for displaying content, {% if condition %} for conditional logic, and {% for item in list %} for looping. Refer to the documentation for a complete list.