How to insert a dynamic image in an email (any platform)

Inserting a dynamic image in an email feels like it should be as simple as inserting any other image. In a way it is: at the end of the day, it's one image tag. The difference is what goes inside that tag, and which block of your email editor you put it in.

This guide covers how to insert a dynamic image in an email on any platform, with a merge tag cheat sheet for the most popular email service providers.

What makes an image dynamic

A regular email image points to a stored file. A dynamic image points to a rendering service, with parameters in the address that describe what to draw. When the email is opened, the service generates the image for that specific reader and moment.

The parameters are filled by your email platform's merge tags, so each subscriber's email contains their own values. The rendering service does the drawing when they open.

The general steps (any platform)

1. Create the dynamic image

In Alterable, open the dynamic image builder, upload your artwork, and add variables wherever personal values should appear: name, city, points, code. Set a fallback for each variable. Add rules if the image should change by location, device, language, time of day, or weather.

2. Copy the embed code

Alterable gives you an image tag wrapped in a link. The image address includes each variable as a parameter, with a placeholder where your platform's merge tag goes.

3. Replace placeholders with merge tags

Swap each placeholder for the matching merge tag from your email platform. The cheat sheet below covers common ones.

4. Paste into an HTML or code block

Not the standard image block. Standard image blocks usually expect a fixed file or plain address and won't fill in merge tags. Every major editor has an HTML, code, or custom HTML block for this.

5. Preview with real contacts

Many platforms don't fill contact-specific merge tags in test sends, so dynamic images can look broken in tests when they're fine. Use your platform's preview with a real contact selected, or send the live email to a small segment of your own addresses.

Merge tag cheat sheet

First-name examples for common platforms. Custom fields follow the same pattern with their own field names.

• Mailchimp: *|FNAME|*, or *|URL:FNAME|* to encode special characters. Paste into a Code block.
• Klaviyo: {{ first_name|default:'there' }}; other properties as {{ person.property_name }}. Paste into an HTML block.
• HubSpot: {{ contact.firstname }}. Use a rich text module's source code or a custom HTML module, depending on your editor.
• Brevo: {{ contact.FIRSTNAME }}. Paste into an HTML block.
• ActiveCampaign: %FIRSTNAME%. Use an HTML or code block.
• Kit: {{ subscriber.first_name }}. Use an HTML block in the editor.

Field names in your account may differ, especially for custom fields. Check your platform's list of fields or personalization tags, and copy tags rather than typing them. Alterable's platform-specific guides list exact syntax for each.

Platform notes

Constant Contact

The current Constant Contact editor doesn't have a custom HTML block. You can add an image by URL through the regular Image block, which works for content that's the same for everyone (like a standard countdown timer). Personalized parameters don't fit reliably in that URL field.

Automated flows

In flows, you often have event data as well as profile data. In Klaviyo, for example, an abandoned checkout flow can pass the product someone left behind into the image. Check your platform's documentation for event variables.

Avoiding common problems

If everyone sees the default, the merge tag isn't filling in. Check spelling and capitalization; many platforms treat "City" and "city" as different fields. Confirm the embed is in an HTML block.

If some subscribers' images break, look for special characters in their data. Names with spaces, apostrophes, or accents need URL encoding, which platforms like Mailchimp and Klaviyo support with modifiers or filters.

If the image looks wrong on mobile, check that your HTML sets a sensible width and lets the height scale.

If images don't appear at all for some readers, they may have images turned off. Write alt text that works without the personal values, and keep your main message and button as live text.

Beyond personalized images

The same insertion process works for every type of open-time content in Alterable: countdown timers, dynamic product blocks, store maps, one-click surveys, and scratch cards. Learn it once and you can add any of them to any email platform.

The free plan includes all of it, which covers 10,000 impressions a month with nothing branded. Pick an email, build a dynamic image at alterable.com, and follow the steps above. You'll have it working in less time than it takes to design a static banner.