HubSpot Marketing: How to create a ‘Related Content’ email module

Mia, our Digital Marketing Executive, tasked me with creating an email module for a drag and drop editor that automatically updates with related content from our HubDB.

The module should be based on the recipient's interest area, which is selected from a multi-select column in the HubDB table containing six different options.


Mia also requested that the module be designed to allow her to choose one of these options, and then pull the four most recent entries from the table. Each content line should include the content title and URL and look like the example you can see below.

related content used in a programmable email

To achieve this, first I got the programmable email feature for the email template enabled. In the design manager of our HubSpot account I created a new module selecting ‘Emails’ checkbox when choosing where the module will be used. Then in the inspector on the right, I toggled ‘Enable module for programmable email beta’ switch on.

programmmable-email-enabled

After that I added a ‘Choice field’ in the fields section with six choices that reflected six interest area options from the HubDB table.

Then, in the HTML/HubL window, I specified which table I want to pull the information from:

hubdb_table_id

Next, I set up a filter to select rows from the table where one of the ‘areas of interest’ matches the choice selected in the email module. To achieve this I applied a query parameter, by adding the column name, followed by two underscores and then the ‘in’ operator and concatenated it with the modules interest area choice. By using a regex_replace filter I made sure that the underscores from the choices in the choice field are replaced with the space and match the options in the HubDB table.

setting_queryparam_filter

If you want to find out more about filtering specific data, read this developers documentation article.

Then I set a ‘table_rows’ variable and fetched a list of rows from the table with the use of the queryparam filter that I set up before.

The next step was to create a simple HTML structure that was going to hold titles and URLs from the HubDB table. Because Mia Lee wanted to display only the last four articles within the given interest area, I set up the loop index to less than 5. I also used a ‘sort’ filter to display content in the reverse order, with the most recent entry placed on the top of the list. 

fetching_data_from_hubdb

You can read more about the sort filter here.

Here is the full code I created for the programmable email. 

programmable_email_module_full_code

Using programmable emails provides many benefits for customising your email content. This way you can incorporate structured data sources like HubDB tables and custom objects into your emails, which gives you more flexibility and control over your messaging. 

You can easily filter and pull specific information from your database and automatically update your email modules with relevant content. This makes it easier to create targeted and personalised email campaigns that resonate with your audience, ultimately leading to better engagement and higher conversion rates.

 

justyna-wegner

Author: Justyna Wegner

Web Developer