Skip to main content

How do advanced elements work?

Learn about dynamic modules and dynamic images that are served based on a templating language logic - with visual logic editor.

Gergely Nagy avatar
Written by Gergely Nagy
Updated yesterday

Using Dynamic Blocks (Advanced Elements) for Personalization

There are three advanced elements available in Chamaileon’s editor: Loop, Conditional, and Dynamic Image.


They allow you to create personalized, data-driven email content that changes automatically based on your subscribers’ data without building multiple versions of the same email.

These elements are only visible if the “Advanced elements” privilege is enabled for your workspace.

Chamaileon generates different HTML output for Dynamic Image, Loop, and Conditional elements depending on the templating language you select in your email properties.


You can choose from Handlebars, Liquid, Mustache, Adobe Campaign (classic), or Mailchimp templating languages.

💡 Why Use Dynamic Blocks?

Dynamic blocks (modules) make personalization and automation much easier.
Instead of creating separate emails for different user segments, you can create one master email with conditional and looping logic. Your ESP (Email Service Provider) will then display the right version based on recipient data.

Here are a few examples:

  • Send one email to both free and premium users, showing different offers or CTAs for each group.

  • Display localized product recommendations or event listings based on region.

  • Add a loop to show a dynamic number of items (e.g., “last 3 purchased items” or “recommended articles”).

  • Personalize images, such as profile pictures or banners, using dynamic image URLs.

With dynamic blocks, you can merge multiple sends into one saving time, reducing human error, and ensuring all audiences receive consistent design and structure.

Dynamic image

The Dynamic Image element is similar to a standard image, but it uses a variable-based URL instead of a static one.

In the editor and preview, you’ll see a placeholder image. During sending, your ESP will replace that placeholder with the real image, based on your data field (e.g., user.profilePic).

Properties

Property

Type

Description

url

string

Must contain a valid variable/expression used by your ESP.

altText

string

Add manually, can also contain expressions.

width / height

number

Define fixed dimensions to maintain layout consistency.

Example:
If you want each recipient’s profile picture to appear in the email, you can use a Dynamic Image with a URL expression:

https://cdn.myserver.com/profiles/{{user.id}}.jpg

Your ESP will then replace the placeholder with the actual image during send.

⚠️ Make sure all dynamic images have the same dimensions to prevent layout shifts.

Conditional element

The Conditional element allows you to show or hide parts of your email based on specific rules (expressions).
This helps you create personalized experiences for different audiences — for example, showing a different hero banner, CTA, or product block depending on user attributes.

Example: Gender-based personalization

In this example, the content will only be shown if the recipient’s gender field equals male.


You can type your condition directly in the Expression field (e.g., gender=male) and optionally define an Else block for fallback content.

In the email properties, as mentioned, you can set a templating language:

Once you set the Templating language in your Email properties, Chamaileon automatically generates the correct syntax.

Example output in Adobe Campaign Classic:

<% if (gender=male) { %> <!-- Content --> <% } %>

💡 You can switch between supported templating languages (Handlebars, Liquid, Mustache, Mailchimp, or Adobe Campaign Classic) anytime under Email properties to match your ESP or CRM’s syntax requirements.


​Learn more about conditional syntax for your templating language:

🧩 In the editor’s preview, all conditional states are shown at once.
You’ll see the correct version only after testing or sending through your ESP.

Loop element

The Loop element is used when you want to display a variable number of items — for example, product lists, recent orders, or recommended articles.

The Loop element iterates through your data array and duplicates its child elements for each item in that list.

Example:

{   "type": "LOOP",   "expression": "user.orderHistory",   "children": [     ...   ] }

If your data contains three items under user.orderHistory, the Loop will automatically generate three repeated content blocks — one for each item.

Use cases:

  • Order history summary

  • “Recently viewed” or “Recommended for you” product grids

  • Dynamic event listings

  • Multi-item newsletters with variable article counts

Properties

Property

Type

Description

expression

string

Must be a valid expression referencing your data array.

children

array

May contain any element type (except full-width elements).

For more information you can visit:

If you are using Mustache: https://mustache.github.io/mustache.5.html

Putting It All Together

By combining Dynamic image, Conditional, and Loop elements, you can create extremely flexible email templates that adjust automatically to each subscriber.

Example use case:

Instead of sending three separate emails for Bronze, Silver, and Gold users, you can build a single email:

  • Use a Conditional block to show different greetings and header banners per tier.

  • Use a Loop block to show each user’s available rewards.

  • Add Dynamic Images for profile pictures or product thumbnails.

All three user groups receive the same email file — but each recipient sees only the parts that match their data.

This approach helps you:

  • Avoid maintaining multiple versions of the same campaign

  • Reduce production and QA time

  • Keep a consistent layout and brand style

  • Scale personalization easily across campaigns

Did this answer your question?