The Email Love Figma Plugin pushes your email designs straight into Mailjet's template library β no copy-paste required. Save your Mailjet API Key and Secret Key once, click Export, and the template (with images and Mailjet-friendly HTML) shows up in your Mailjet account, ready to use in a campaign or transactional send. Turn on Enable Updatable Templates and re-exporting the same Figma frame overwrites the existing Mailjet template in place instead of creating a duplicate.
Prerequisites
Before you begin, make sure you have:
- An active Mailjet account
- An API Key (Public) and Secret Key (Private) pair from Mailjet β grab them at app.mailjet.com/account/api_keys
- The Email Love Figma plugin installed
- At least one email designed in Figma using the plugin
- An Email Love Footer with an Unsubscribe link in your design (required for export)
Step 1: Open the Export Panel
- Select the email frame you want to export in Figma
- Click the Export button in the top right of the plugin
- Pick Mailjet from the export dropdown β you can also start typing "mailjet" to filter the list
The dropdown is alphabetised, so Mailjet sits in the M section of the AβZ list of ESPs underneath the HTML, MJML, and Composa options.
Step 2: Connect Your Mailjet Account
The first time you export to Mailjet you'll see the credentials form. Fill in:
- API Key (Public) β from your Mailjet API Keys page
- Secret Key (Private) β from your Mailjet API Keys page (treat it like a password)
- Mailjet API Key Name β a friendly name for this set of credentials (e.g. "Marketing β Production"). You can save multiple Mailjet key pairs and switch between them.
- Click Set API Key
Mailjet authenticates with Basic Auth built from publicKey:secretKey, so both halves are required β the public key alone won't work. Both keys are encrypted and stored in the plugin so you only have to enter them once per connection. To swap to a different Mailjet key pair later, click Change API key in the same panel.
Step 3: Export Your Email
- With Mailjet selected and your credentials loaded, click Export
- The plugin sends your HTML and images to the Email Love backend, which calls Mailjet's REST API:
POST /v3/REST/templateto create the template shell, thenPOST /v3/REST/template/{id}/detailcontentto upload the HTML
- On success you get a Successfully exported! toast β your template is now live in Mailjet
The template's name in Mailjet is taken from your Figma frame name, so rename the frame before exporting if you want it to show up with a specific title.
Step 4 (Optional): Enable Updatable Templates
Once you've saved a Mailjet API key, an Enable Updatable Templates toggle appears below the credentials. With it on, re-exporting the same Figma frame overwrites the existing Mailjet template in place instead of creating a duplicate.
How it works:
- The first export creates a new template and stores the returned Mailjet template ID on the Figma frame's plugin data
- With Enable Updatable Templates on, subsequent exports of the same frame call
POST /v3/REST/template/{existingId}/detailcontentto overwrite just the HTML content β keeping the same template ID, name, and any other Mailjet-side metadata intact
- If the update fails (for example, the template was deleted in Mailjet), the plugin automatically falls back to creating a new template
- On a successful update you'll see a Successfully updated! toast instead of Successfully exported!
Leave the toggle off to always create a new template. Note that the template ID is tied to the Figma frame, so duplicating a frame, renaming it, or opening from a fresh session may cause the plugin to treat it as a brand new template.
Step 5: Use Your Template in Mailjet
- Log into Mailjet and open the account you exported to
- Navigate to Templates (or Email Templates)
- Find the template you just exported (it'll be at the top of the list, named after your Figma frame)
- Use it in any marketing campaign, automation, or transactional send like you would any other Mailjet template
Editing Your Template in Mailjet
You can edit the template HTML directly in Mailjet's editor, but for ongoing changes we recommend editing in Figma and re-exporting with Enable Updatable Templates on, so your Figma file stays the single source of truth and the template ID in Mailjet stays stable.
What the Plugin Does for You
- Pushes the template to Mailjet via the REST API using the saved key pair
- Hosts your images so they render correctly when Mailjet sends the email
- Handles unsubscribe links β the Email Love Footer's unsubscribe link is preserved so it works with Mailjet's send infrastructure
- Generates responsive, deliverable HTML that renders consistently across major email clients
- Stores credentials per key pair β switch between multiple Mailjet accounts from the same Figma file via the Mailjet API Key Name dropdown
- In-place updates (optional) β with Updatable Templates on, re-exports keep the same Mailjet template ID instead of creating duplicates
Troubleshooting
Authentication errors / 401: Mailjet requires both the public API key and the secret key. Open Change API key, re-paste both values from app.mailjet.com/account/api_keys, and confirm you copied them from the same row of Mailjet's API Keys page. Pasting one half from one key and the other half from another won't authenticate.
Wrong account / template went somewhere unexpected: Each Mailjet API key pair is scoped to one Mailjet account. If you have multiple accounts (e.g. Production, Staging) make sure you saved the right key pair under a clear connection name. Add a new connection if needed and switch between them via the Mailjet API Key Name dropdown.
"Enable Updatable Templates" created a new template anyway: The toggle only updates a template the plugin previously created from this exact Figma frame. If you duplicated the frame, renamed it, or it's a brand new frame, the plugin will create a new template instead. The plugin also falls back to creating a new template if the original was deleted in Mailjet.
Unsubscribe link not working: Make sure your design includes an Email Love Footer with an Unsubscribe link. Without one, the plugin can't wire up the unsubscribe handling for Mailjet.
Template shows up but content looks broken: Re-export rather than editing the HTML directly in Mailjet. For ongoing changes, treat Figma as the source of truth and use Enable Updatable Templates to push updates.
Need help? Join our Discord community or reach out to our support team at hello@emaillove.com for assistance.
Related Articles
- Export Overview β Understand all export options and how the plugin converts your Figma design to HTML
- Image Hosting β How the plugin handles image hosting during export
