The Email Love Figma Plugin connects directly to Customer.io, letting you export professionally designed emails from Figma straight into Customer.io. Stop re-building your Figma designs in HTML or in a drag-and-drop-builder and cut your email production time in half.
Exporting your email to Customer.io
The Export feature in the Email Love Figma plugin allows you to easily convert your email design into email-friendly HTML and manually import it into Customer.io (API integration coming soon).
Follow these steps to export your email design.
- Ensure that your email design is finalized and ready for export, then click on the frame you want to export to ensure it is selected. Please note, you will need to use an Email Love Footer with an Unsubscribe link for the export to work. We will automatically merge in the Customer.io Unsubscribe token.
- Click the Export button located in the top right corner of the Plugin interface.
- On the Export page, select "Customer.io" from the dropdown menu.
- Click the "Copy Customer.io code" button (or download the file to save it to your computer). The plugin will automatically host your images and prepare your HTML with Customer.io's unsubscribe merge tag.
- Navigate to your Customer.io account and go to Content > Email Layouts.
- Click "Create layout" and then "Start from scratch".
- Give your layout a name (e.g., "October Newsletter Template").
- Delete the existing HTML in the editor, but keep the
{{content}}
merge tag. Click "Save" to create an empty template.
- Click "Edit layout" again, then paste your Email Love HTML above the
{{content}}
merge tag. Click "Save" and then "Done editing".
- Navigate to Campaigns or Broadcasts and create a new message.
- When you reach the content section, select Email as your channel, then click "Upload content".
- Go to the Code section and select your newly created template from the list. Click "Create email".
Edit your email inside of Customer.io
Once you have exported your email, you can find it in your Email Layouts. From there, you can use it in campaigns and broadcasts, send test emails, and edit the content using Customer.io's built-in editor or directly in the HTML.
Need help? Join our Discord community or reach out to our support team for assistance with the Email Love Figma Plugin.