Export to Brevo
Export from Sendra and paste into Brevo's HTML custom code editor, with the unsubscribe link and postal address every email needs.
Design in Figma, export with Sendra, paste into Brevo’s HTML custom code editor. Brevo sends it as you designed it.
Before you start
Section titled “Before you start”- Put your images online: turn on Host images online in Sendra, or use your own image URLs. Brevo’s image library belongs to its drag and drop editor, and Brevo’s help does not show how to copy an image’s address for pasted code.
- Set your preview text in Properties. It travels in the file.
- Brevo’s help does not say whether the HTML editor needs a paid plan. If HTML custom code is not offered when you start a design, check your plan with Brevo.
- On the free plan, Brevo adds its logo at the bottom of every email.
What Brevo needs in every email
Section titled “What Brevo needs in every email”Put an unsubscribe link and your postal address in the design yourself.
Unsubscribe link. Type “Unsubscribe” in your footer, select it, and put this in its Link field: {{ unsubscribe }}. Give it its own text layer, since Figma’s link box will not accept a tag. If Brevo finds no unsubscribe link, it adds a footer of its own with one when it sends.
Postal address. Type your postal address into your footer text. Brevo’s help names no tag for it, and the law asks for it.
Sending to people in France. Brevo also asks for a link that lets them refuse open tracking. Put {{ revoke_open_pixel_tracking }} in the Link field of a line such as “Stop open tracking”.
Note: type the tags exactly as shown, including the spaces inside the braces. Brevo reads anything in double braces as its own tag, so use only Brevo’s tags in a Brevo email. See Merge tags for how Sendra treats them.
Tags you will use most
Section titled “Tags you will use most”Type these in Figma exactly as shown. Brevo’s HTML editor has no button for inserting tags. Text tags go in a text layer, link tags go in a Link field.
| What it does | Tag | Where |
|---|---|---|
| First name | {{ contact.FIRSTNAME }} |
text |
| Unsubscribe | {{ unsubscribe }} |
Link |
| Update preferences | {{ update_profile }} |
Link |
| View in browser | {{ mirror }} |
Link |
For the first name with a fallback when Brevo has none, type {{ contact.FIRSTNAME|default:"there" }}.
Preview text
Section titled “Preview text”Leave Brevo’s Preview text field empty when you add the subject. Your preview text is already in the file. A template’s preview text does not carry over to a campaign, so check the field on each campaign.
If your account adds a View in browser link to every campaign, turn it off for this one: in the campaign’s Additional settings, click Edit settings, then under Design switch off Enable ‘View in browser’ link. Brevo puts that link above your design, where the inbox shows it before your preview text. To keep a View in browser link, put {{ mirror }} in your design instead.
Paste it in
Section titled “Paste it in”- In Brevo, go to Marketing, then Campaigns, and click Create campaign. Choose Email, then Regular, name it, and click Create campaign.
- Set the recipients, the sender and the subject.
- In the design step, click Start designing, then Start from scratch, then HTML custom code. Some of Brevo’s pages call the second button Create from scratch.
- In Sendra, click Copy HTML. Paste it into the editor and click Save & quit.
To keep it as a template, open Actions on the campaign and choose Save as template. A template you make under Marketing, then Templates, works only after Save & Activate.
Check it
Section titled “Check it”Brevo sends tests to a test list. Set it up once under Settings, then Campaigns, then the test list: up to 20 addresses, each already a contact. Then open the campaign’s Preview & test, choose the Send test email tab, pick the recipients, and click Send test.
Compare it with the test you sent from Sendra. They should match; Brevo adds tracking to your links, which is normal. On the free plan, the links in a test stop working about 30 minutes after it arrives.
Changing it later
Section titled “Changing it later”Keep Figma as the source: change the design, export again, and paste again. An email made in the HTML editor opens in the HTML editor, not in the drag and drop one.
Dynamic content
Section titled “Dynamic content”Brevo fills contact details such as the first name at send time. Merge tags shows how to use tags in text, links and image URLs.