Semplates Documentation

Find your answers below or shoot us an email.

/ Email Personalization - Iterating Through Lists

2 min read

Email Personalization - Iterating Through Lists

Discover how to dynamically generate itemized lists based on each recipient's unique interests or preferences using Handlebars' each helper function.

What is List Iteration?

List iteration is the process of going through items in a list one by one. In the context of email templates, this means you can generate lists dynamically based on the data you have for each recipient.

How to Use the `each` Helper in Semplates

The each helper function iterates through items in an array. For example, you can create an email template that lists each recipient's interests.

Here's an example JSON structure:

{
  "subscription": [
    {
      "interest": "Sports"
    },
    {
      "interest": "Travel"
    },
    {
      "interest": "Cooking"
    }
  ]
}

In your email template, you can use the each helper function as follows:

<ul>
  {{#each subscription}}
    <li>{{interest}}</li>
  {{/each}}
</ul>

This will generate an itemized list of each recipient's interests.

Using list iterations in Semplates

For this example, we will stick to the example of a fictive banking company's communication material. We want to use loops to insert personalized content recommendations, that we send when calling the SES API. The payload might look something like this:

{
  "recommmendedArticles": [
    {
      "heading": "Starting with ETFs",
      "description": "Learn how to start with index funds today. Read our guide to up your ETF game",
      "outlink": "https://company.com/blog/etf-guide-2023"
    },
    {
      "heading": "The power of compounding interests",
      "description": "Why time is the most powerful force in saving for retirement. See this comparison…",
      "outlink": "https://company.com/blog/compounding-interest"
    },
    {
      "heading": "Maximizing Tax Efficiency",
      "description": "Discover strategies to minimize your tax burden while investing. Get the insights now.",
      "outlink": "https://company.com/blog/tax-efficiency-2023"
    }
  ],
  "user": {
    "firstName": "Pablo",
    "personalOutlink": "https://company.com/account/pablo1234"
  }
}

In Semplates' Template Editor, you can easily create a dynamic list by dragging and dropping a text block into your template. In this example we add one html block above and below the content structure we want to create and then insert the Handlebars each helper syntax to iterate through a list of nested objects. We then build a single content block like so:

Semplates' template editor showcasing the use of loops and nested objects

As you can see, we created the structure for a single content recommendation, consisting of title, text and an outlink to the company's finance blog. Now, when opening the Template Preview, you can add placeholders on the right site of the screen and review the rendered template on the left. You can add as many list items as you want, by using the plus icon:

Semplates' template preview showcasing the use of list placeholders

Make sure to test your placeholders thoroughly to ensure that they behave as expected. Incorrectly set conditions could lead to irrelevant or confusing messages.

Important Notes

Pro Tip: Switch to the Expert Mode (available on Premium plans and above), to edit the expected JSON structure directly. This view is especially valuable, when working with complex or large placeholder payloads, and, when aligning your SES API calls to your template designs.

With this guide, you are now equipped to use list iteration in your Semplates email templates, allowing for even more personalized and dynamic content. We also explore other advanced personalization features like nested attributes and using basic conditional statements.