In the Emailify export panel, select the Customer.io option from the dropdown list, then when you’re ready, click the Export For Customer.io button to start exporting the emails you’ve selected from Figma to HTML.

Once the export is finished, download the .zip file to your computer and unzip it, then open the “index.html” inside the folder with your email name in a code/text editor and copy all the HTML in the file, then:

  • Login to your Customer.io account
  • Expand the Content menu item in the admin navigation
  • Then click the Email Layouts menu item
  • Click the Create Layout button
  • Click the Start from scratch option
  • Name your layout and click Create Layout.
  • Paste your copied HTML from the exported index.html file into the Edit tab editor.
  • Click the Save changes button.

​
Creating a totally blank layout in Customer.io

Make sure you’re using a totally blank layout! By default, Customer.io will automatically add its own <html><head><body></body></head></html> tags to any new layout created; you’ll need to ensure that this code is removed, otherwise your HTML template will look broken when it’s sent out.

In Customer.io, when you start creating an email, you’ll need to select a Layout, and this needs to be totally blank, so that your own custom HTML template is the only thing that gets rendered.

As you can see in the screenshot below, selecting a Layout that looks blank, isn’t actually blank (as it has those <html> tags automatically included and wrapping around your HTML template content)

To fix this, you’ll need to manually remove any HTML that Customer.io adds to your blank Layout, and only leave the content tag (below).

After the Layout has been saved and only contains the content tag, your custom HTML template should render as expected.

Was this page helpful?

ConvertKitDotDitigal