> ## Documentation Index
> Fetch the complete documentation index at: https://help.emaillove.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Customer.io

> Export Design Studio emails or reusable templates, choose HTML or editable components, and preview saved content with sample data.

Builder can create a **Design Studio email** or a **reusable template** in Customer.io. Both can use HTML or editable Design Studio components. Reusable-template export is available to all connected Customer.io accounts, subject to your Builder role and plan.

## Connect Customer.io

1. Get an **App API key** with access to Customer.io Design Studio. A Track API key is not the key used by this integration.
2. In Builder, open **Integrations > Customer.io** as a workspace owner or admin.
3. Enter the App API key and select the account's **US** or **EU** region.
4. Save.

See [Customer.io's App API documentation](https://docs.customer.io/integrations/api/app/#tag/design-studio) for Design Studio access.

![Customer.io connection form in Builder](https://mintcdn.com/emaillove/qYrzRKTscc4O0qPw/images/builder/guides/connect-customerio.jpg?fit=max\&auto=format\&n=qYrzRKTscc4O0qPw\&q=85\&s=2b60c0982850cb254d3cedb92e7e85f4)

Connect Customer.io in Integrations before exporting. This example shows blank connection fields; use the credentials for your account.

## Choose what to create

Open the email in Builder, click **Export**, and select your Customer.io account.

Under **Create in Customer.io**, choose:

* **Email** for a Design Studio email you can use in Customer.io.
* **Reusable template** for a starting point you can use to make more emails there.

Under **Editing in Customer.io**, choose:

| Format | Result |
| - | - |
| **HTML code** | The compiled email layout, editable as HTML |
| **Editable Design Studio components** | Supported blocks converted to Customer.io components; custom HTML remains a code block |

Editable export stops if a block cannot be represented safely. Review the result in Customer.io, including desktop, mobile, fonts and any code blocks.

You can enter a **Folder ID** as a Customer.io folder UUID, choose **Use the root folder**, or leave the optional folder choice empty. Updates preserve the saved folder.

Click **Export to Customer.io**. Builder reads the saved destination back before confirming success.

## Preview the saved content

After a verified export, reopen the Customer.io export dialog and click **Preview saved content**.

1. Enter fictional sample data as JSON. For example:

   ```json theme={null}
   {
     "customer": { "first_name": "Alex" },
     "event": {}
   }
   ```

2. Click **Render sample data**.

3. Review the rendered content and switch to the mobile view when needed.

4. Try missing values as well as populated values to check your fallbacks.

This asks Customer.io to render the last verified export for the selected account and language. Builder changes made since that export are not included. It does not look up a real customer or send an email. Sample data is sent to Customer.io for rendering and is not saved by Builder.

Use JSON objects under the supported names: `customer`, `event`, `campaign`, `journey`, `message`, `objects` or `trigger`. Keep the sample under 32 KB.

A reusable template without sender settings may show a sender warning in the preview. Set the final sender and message settings when using it in Customer.io. A successful content preview is not a deliverability or inbox-rendering test.

## Update an email or template

Export to the same account again and choose the update option. Builder checks the destination against the last verified export before writing and verifies the saved result afterward.

* Existing asset type, editing format and folder stay fixed in the dialog. Create a new copy to choose a different type or format.
* If the content is already up to date, Builder reports that no export allowance was used.
* If content changed in Customer.io, the update stops. Keep editing that version there or create a new copy from Builder.
* An older export without a verified destination may need a new copy.

Builder updates its exported content without replacing unrelated sender, language-variant or transformer settings. Edits made in Customer.io do not sync back into Builder.

## Use the result in Customer.io

Exports do not link the asset to a workflow, publish it, activate an audience or send a message. Choose where to use the email or reusable template in Customer.io, set the message details, and test it before sending.

## Troubleshooting

| What you see | What to do |
| - | - |
| The connection fails | Check that you used an App API key with Design Studio access and the correct region. |
| The folder ID is invalid | Use a folder UUID from Customer.io, or choose the root folder. |
| An editable block is unsupported | Simplify that block or create a new copy using HTML code. |
| Preview saved content is unavailable | Complete a verified export to this account first. |
| Sample data cannot be rendered | Check the JSON, supported object names and the tokens used by the saved content. |
| The destination changed | Review the Customer.io version before choosing whether to create a new copy. |
| The export outcome is uncertain | Check delivery status and Customer.io before starting another export. Contact Email Love if it remains unresolved. |

See [verified updates and delivery status](https://help.emaillove.com/builder/sending/esps.md#verified-updates-and-delivery-status) for the shared export behavior.

## Connection and reporting

See the [Customer.io integration guide](https://help.emaillove.com/builder/integrations/customerio.md) for connection setup and current aggregate reporting support. For the shared Reports and AI workflow, see [Email insights and reporting](https://help.emaillove.com/builder/reports/email-insights.md).


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.