Personalization and merge tags

Merge tags in text, links and image addresses reach the exported HTML exactly as typed.

# Personalization and merge tags

Your email platform fills in personalization when it sends: a first name, an unsubscribe link, a product picture chosen for each recipient. It finds merge tags in the HTML and replaces them. Type the tag in Figma, and Sendra passes it to the exported HTML exactly as you typed it.

## What passes through

A merge tag survives the export unchanged in three places.

- **Text.** Type the tag in any text layer, in the middle of a sentence or on its own. Every character of the tag ships as typed, braces, percent signs, pipes and dollar signs included.
- **Links.** Paste the tag into **Link** in the Customize tab, on a button, an image or a text layer, and it ships as that layer's link. A full web address with a tag inside it works too, such as `https://example.com/offer?ref={{ id }}`. **Link** also takes `mailto:`, `tel:` and `sms:` links, as typed. See [Customize a layer](/customize-a-layer/#link).
- **Image addresses.** Paste the tag into **Image URL** on an image's card in the export window. The tag becomes the image's address in the HTML, with the design's width and height. Sendra does not host that image, and the export window's check for images without an address counts it as supplied.

The **Minify HTML** setting makes no difference: the tag is the same with it on or off. The version of a button that Outlook reads carries the tag too, in its label and its link.

## Where to type it

Type each tag in one text style and on one line. A tag that changes weight or colour partway through, or breaks across two lines, is split in the HTML the same way, and the platform will not recognise it.

## One example per platform

Use the tags your platform documents. These forms all pass through.

- **Klaviyo:** `{{ first_name }}` in text, `{% unsubscribe %}` as a link.
- **Mailchimp:** `*|FNAME|*` in text, `*|UNSUB|*` as a link.
- **HubSpot:** `{{ contact.firstname }}`
- **Braze:** `{{${first_name}}}`
- **Customer.io:** `{{customer.first_name}}`

## The preview shows the tag

The preview and a test send from Sendra show the tag itself, `{{ first_name }}` rather than a name, because only your platform knows who each email goes to. An image whose address is a tag shows the design's own picture in the preview. To see the filled-in result, send a test from your platform.

Your email platform fills in personalization when it sends: a first name, an unsubscribe link, a product picture chosen for each recipient. It finds merge tags in the HTML and replaces them. Type the tag in Figma, and Sendra passes it to the exported HTML exactly as you typed it.

What passes through

A merge tag survives the export unchanged in three places.

Text. Type the tag in any text layer, in the middle of a sentence or on its own. Every character of the tag ships as typed, braces, percent signs, pipes and dollar signs included.
Links. Paste the tag into Link in the Customize tab, on a button, an image or a text layer, and it ships as that layer’s link. A full web address with a tag inside it works too, such as https://example.com/offer?ref={{ id }}. Link also takes mailto:, tel: and sms: links, as typed. See Customize a layer.
Image addresses. Paste the tag into Image URL on an image’s card in the export window. The tag becomes the image’s address in the HTML, with the design’s width and height. Sendra does not host that image, and the export window’s check for images without an address counts it as supplied.

The Minify HTML setting makes no difference: the tag is the same with it on or off. The version of a button that Outlook reads carries the tag too, in its label and its link.

Where to type it

Type each tag in one text style and on one line. A tag that changes weight or colour partway through, or breaks across two lines, is split in the HTML the same way, and the platform will not recognise it.

One example per platform

Use the tags your platform documents. These forms all pass through.

Klaviyo: {{ first_name }} in text, {% unsubscribe %} as a link.
Mailchimp: *|FNAME|* in text, *|UNSUB|* as a link.
HubSpot: {{ contact.firstname }}
Braze: {{${first_name}}}
Customer.io: {{customer.first_name}}

The preview shows the tag

The preview and a test send from Sendra show the tag itself, {{ first_name }} rather than a name, because only your platform knows who each email goes to. An image whose address is a tag shows the design’s own picture in the preview. To see the filled-in result, send a test from your platform.