Export to Kit

Design in Figma, export with Sendra, paste into a Kit HTML email template, and send a broadcast with it. HTML templates are on every Kit plan, the free one included.

Before you start

• Put your images online: turn on Host images online in Sendra, or use your own image URLs. Kit’s help says you can also upload an image into a broadcast and copy its direct link, but does not show where that link is. If you use one, open it in your browser first to check that it shows the image.
• Decide how you will use the template: for one whole email designed in Figma, or as a frame you reuse for many broadcasts. Kit puts each broadcast’s own text into the template, at a content tag. Your choice also decides where you set the preview text, below.
• On the free plan, Kit adds its Built with Kit badge to email templates.

What Kit needs in every template

Kit asks every template for the content tag and an unsubscribe link, and for your mailing address.

Content tag. Put {{ message_content }} in a text layer of its own where a broadcast’s text should appear, for example between your header and your footer. If the whole email is in your design, put it after your last section, where an empty line does no harm. Kit’s help does not say whether a broadcast can go out with no text of its own, so send yourself a test first.

Unsubscribe link. Type “Unsubscribe” in your footer, select it, and put this in its Link field: {{ unsubscribe_url }}. Give it its own text layer, since Figma’s link box will not accept a tag.

Mailing address. Put {{ address }} in your footer text. Kit fills it from your account settings. Kit’s preview does not warn you when the address is missing, so check that it is there.

Note: type the tags exactly as shown, including the spaces inside the braces. Kit reads double braces as its own tags and does not save or send an email with a tag it cannot read, so use only Kit’s tags in a Kit email. See Merge tags for how Sendra treats them.

Tags you will use most

Type these in Figma exactly as shown. Text tags go in a text layer, link tags go in a Link field.

What it does	Tag	Where
The broadcast’s text	{{ message_content }}	text
First name	{{ subscriber.first_name }}	text
Mailing address	{{ address }}	text
Unsubscribe	{{ unsubscribe_url }}	Link
Update preferences	{{ subscriber_preferences_url }}	Link

For the first name with a fallback when Kit has none, type {{ subscriber.first_name | strip | default: "there" }}.

Preview text

If the whole email is designed in Figma, set the preview text in Sendra’s Properties as usual, and leave the broadcast’s + Add preview text unused. Your preview text travels in the file.

If one template is reused for many broadcasts, leave Preview text empty in Sendra and set it on each broadcast with + Add preview text. Preview text set in Sendra would show on every broadcast that uses the template.

Kit’s help does not say how its preview text works with an HTML template, so send yourself a test and check the line your inbox shows under the subject.

Make the template

1. In Kit, click Broadcasts, then Templates.
2. Click + New Email Template, scroll down, and choose Create HTML Template.
3. In Sendra, click Copy HTML. Paste it into the editor and click Save.
4. Start a broadcast: Broadcasts, then + New Broadcast. On the sidebar’s Email tab, click Browse templates and choose your template.

Check it

Click Preview email on the toolbar, then Send test email. Tags are not filled in a preview; to see them filled, send the broadcast only to yourself, by filtering its recipients to your own address.

Then open the test on a phone and compare it with Sendra’s phone preview. Kit’s help does not say what it keeps of the start of a pasted file, where Sendra keeps the email’s phone layout; if they differ, write to support@hellosendra.com.

Compare it with the test you sent from Sendra too. They should match; Kit adds tracking to your links, which is normal.

Changing it later

Keep Figma as the source: change the design, export again, and paste the new version into the template. A change to a template applies to every email that uses it.

Dynamic content

Kit fills subscriber fields such as the first name at send time. Merge tags shows how to use tags in text, links and image URLs.