Adding dynamic and personalized content using Emailify
You can add dynamic content to your emails using a combination of merge tags (provided by your email marketing platform) and custom code blocks (in the syntax that your email marketing platform uses).
Adding platform specific personalization content
You can add personalised text for things like people’s names by adding the merge tags from your email service provider (eg. MailChimp, Klaviyo etc). You can do this by adding your merge tag into your Emailify text content layers.
As an example, adding Hello, %FIRSTNAME%
or Hello, *|FNAME|*
(depending on your platform’s syntax and values) to your Figma text layer’s content will make merge tag will automatically be swapped out with the real data when the email gets sent out.
Some platform specific template variable documentation
Links to some (but not all) popular platforms are listed below:
- MailChimp Merge Tags
- Klaviyo Template Tags
- Campaign Monitor Template Syntax
- Postmark Template Syntax
- SendGrid Substitution Tags
- HubSpot Personalization Tokens
- ActiveCampaign Personalization Tags
- Mailjet Email Personalization
- SendPulse Email Personalization
- Braze Personalization Tags
- Iterable Template Personalization
- DotDigital Personlization Tags
- Intercom Personlization Tags
Add if/else logic between your Row, Wrapper or Hero Layers
You can use the 🧑💻 Custom Code layer type to insert custom templating logic between the rows in your designs; you’ll need to make sure the syntax is correct for the email marketing platform that you’re using; but it would look something like:
{% if customer_type == 'premium' %}
{% else %}
{% endif %}
Add personalized/dynamic images
You can override the image URL for a certain image layer in your email designs by adding a value to the Override Image Src input field. You can either use a URL for an image that’s already uploaded somewhere (eg. https://mycdn/img.jpg
) or a dynamic variable for your email platform’s templating language (eg. { variable.my_image }
) which will be automatically added to the src
attribute of the <img>
tag when the HTML is exported.
Looping a Data Table Row with dynamic data
If you’re using a Data Table and need to iterate over some data in your email marketing platform, you can apply a for loop by clicking on a Data Table Row inside of your Data Table, then clicking the Settings button in the plugin header and adding your templating syntax for a loop into the Opening Code Wrapper (eg. {{ #each myItems }}
) and Closing Code Wrapper (eg. {{ /#each }}
), which will autamatically inject these opening and closing tags around the <tr>
HTML table row element in your exported code.
Once you’ve added your wrapper tags to the Data Table Row layer, you can populate the dynamic content inside the layers of your row as needed.
Was this page helpful?