Export Options & ESP Compatibility

Overview

Migma creates emails compatible with ALL email service providers through intelligent code generation and dynamic variable support. Export to HTML, React Email, or MJML with ESP-specific variables preserved.

No Vendor Lock-In

Export to any format, use anywhere

ESP Variables

HubL, Liquid, Mustache, and more preserved

Universal Compatibility

Works with 30+ email clients

Export Formats

1. HTML (Email-Safe)

Standard HTML with inline CSS - works everywhere

Features
Compatibility
Technical Details

Includes:

Inline CSS styles
Table-based layout (Outlook compatible)
Email-safe HTML tags only
Responsive media queries
Dark mode support
Proper DOCTYPE for email clients

Perfect for:

Direct ESP upload
Maximum compatibility
Simple workflows

2. React Email

React components for modern email workflows

Features
Example Output
Integration

Migma generates:

Clean JSX components
Tailwind CSS classes
TypeScript support (optional)
Reusable components
Props for customization

Perfect for:

Next.js applications
Developer workflows
Version control (Git)
Component reusability
Programmatic email generation

3. MJML

Responsive email framework markup

Features
Example Output
Compile

MJML output includes:

Semantic MJML tags
Automatic responsiveness
Clean code structure
ESP compatibility built-in

Perfect for:

MJML-based workflows
Marketing teams using MJML
Framework flexibility

ESP-Specific Variables

How Migma Handles Dynamic Variables

Migma preserves ESP variables during export. You can use any template language:

HubSpot (HubL)

Syntax: {{ variable_name }}Example in Migma:

Hello {{ contact.firstname }}!

Your order #{{ content.order_number }} has shipped.

{% if contact.vip_status %}
Thanks for being a VIP member!
{% endif %}

Migma preserves:

Variables: {{ contact.* }}
Conditionals: {% if %}...{% endif %}
Loops: {% for %}...{% endfor %}
Filters: {{ variable|upper }}

Export: Variables remain intact in HTML

Mailchimp (Merge Tags)

Syntax: *|VARIABLE|*Example in Migma:

Hi *|FNAME|*,

This email was sent to *|EMAIL|*.

*|IF:INTERESTED_IN_CATEGORY=technology|*
Check out our latest tech products!
*|END:IF|*

*|HTML:CUSTOM_CONTENT|*

Migma preserves:

Merge tags: *|FNAME|*, *|LNAME|*
Conditional content: *|IF:|*...*|END:IF|*
Custom HTML: *|HTML:...|*

Klaviyo (Liquid)

Syntax: {{ variable }} and {% tag %}Example in Migma:

Hello {{ person.first_name | default: 'there' }}!

{% if event.ProductName %}
You viewed: {{ event.ProductName }}
Price: {{ event.ProductPrice | money }}
{% endif %}

{% for item in event.Items %}
- {{ item.ProductName }}: ${{ item.Price }}
{% endfor %}

Migma preserves:

Variables with filters
Conditionals
Loops
Custom properties

SendGrid (Handlebars)

Syntax: {{variable}} and {{#if}}...{{/if}}Example in Migma:

Hi {{firstName}},

{{#if isPremium}}
Premium features are now available!
{{else}}
Upgrade to unlock premium features.
{{/if}}

{{#each products}}
- {{this.name}}: ${{this.price}}
{{/each}}

Migma preserves:

Variables
Conditionals
Loops
Helpers

Amazon SES (Mustache)

Syntax: {{variable}}Example in Migma:

Hello {{name}},

Your subscription expires on {{expirationDate}}.

{{#items}}
- {{productName}}: {{price}}
{{/items}}

Migma preserves:

Simple variables
Sections (loops)
Inverted sections

Custom Variables

Any syntax supported!Tell Migma which variables to preserve:

Create welcome email with these variables:
- %%FIRSTNAME%%
- %%SIGNUP_DATE%%
- %%PLAN_NAME%%

Use my ESP's %% syntax

Migma recognizes and preserves your custom format

How to Use ESP Variables

During Email Creation

In your prompts:

Create order confirmation email

Include:
- Customer name: {{ customer.name }}
- Order number: {{ order.number }}
- Order total: {{ order.total | currency }}
- Order items loop: {% for item in order.items %}

Use HubSpot HubL syntax

Migma will:

Generate email structure
Insert variables in correct locations
Preserve exact variable syntax
Export with variables intact

In Visual Editor

Add variables manually:

Click text element
Type variable syntax directly: Hello {{ firstname }}!
Variables highlighted in editor
Preserved on export

Or use variable inserter:

Click “Insert Variable” button
Select ESP type (HubSpot, Mailchimp, etc.)
Choose variable from list
Inserted with correct syntax

Export Process

Finalize Email

Complete your email in Migma chat or visual editor

Click Export

Click “Export” button in toolbar

Choose Format

Select export format:

HTML (email-safe)
React Email (JSX)
MJML

Configure ESP Settings

If using ESP variables:

Select your ESP from dropdown
Verify variable syntax
Enable/disable features

Options:

Include unsubscribe link
Add tracking pixels
Preserve ESP comments

Download or Copy

Download: Get .html, .jsx, or .mjml file Copy: Copy code to clipboard Direct export: Send to integrated ESP

Upload to ESP

Paste/upload to your email service provider

Direct ESP Export

Export directly to integrated platforms:

Mailchimp

One-click export:

Click “Export to Mailchimp”
Select campaign or template
Authorize (first time)
Email uploads automatically

Klaviyo

Direct integration:

Click “Export to Klaviyo”
Choose template or campaign
Authenticate
Syncs to Klaviyo account

HubSpot

Push to HubSpot:

Export to HubSpot
Select email type
OAuth authorization
Creates draft in HubSpot

Custom Webhook

Send via webhook:

Configure webhook URL
Map email fields
Set authentication
POST email HTML/JSON

Platform Integrations

Complete guide to ESP integrations

Email Client Compatibility

How Migma Ensures Compatibility

Inline CSS

All styles inlined for email clients that strip <style> tagsBefore:

<style>.button { background: blue; }</style>
<a class="button">Click</a>

After export:

<a style="background: blue; padding: 12px 24px; border-radius: 4px;">Click</a>

Table-Based Layouts

Outlook compatibility requires table layoutsMigma uses:

<table role="presentation" cellpadding="0" cellspacing="0">
  <tr>
    <td><!-- Content --></td>
  </tr>
</table>

Why: Outlook uses Word rendering engine (doesn’t support modern CSS)

Conditional Comments

Outlook-specific fixes:

<!--[if mso]>
<table><tr><td width="600">
<![endif]-->

<div style="max-width:600px;">
  <!-- Content -->
</div>

<!--[if mso]>
</td></tr></table>
<![endif]-->

Only Outlook sees table wrapper

Web Fonts with Fallbacks

Google Fonts + fallbacks:

<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet">

<p style="font-family: 'Open Sans', Arial, sans-serif;">
  Text content
</p>

If font fails: Falls back to Arial, then sans-serif

Dark Mode Support

Automatic dark mode styles:

<style>
@media (prefers-color-scheme: dark) {
  .dark-text { color: #ffffff !important; }
  .dark-bg { background-color: #1a1a1a !important; }
}
</style>

Works in: Apple Mail, Gmail, Outlook (iOS)

Responsive Design

Media queries for mobile:

<style>
@media only screen and (max-width: 600px) {
  .mobile-full-width { width: 100% !important; }
  .mobile-hide { display: none !important; }
  .mobile-stack { display: block !important; width: 100% !important; }
}
</style>

Columns stack on mobile automatically

Download Options

File Formats

.html
.jsx / .tsx
.mjml
.zip

Single HTML file

Complete, standalone email
Inline CSS
Base64-encoded images (optional)
Ready to upload anywhere

Copy Options

Quick copy to clipboard:

Copy HTML

Copies complete HTML code

Copy Inline

HTML with all CSS inlined

Copy Preview

Text-only preview version

Keyboard shortcut: Ctrl/Cmd + Shift + C

Advanced Export Features

Custom Code Injection

Add tracking pixels, analytics, etc.:

Open Export Settings

Click “Advanced” in export dialog

Inject Head Code

<!-- Google Analytics -->
<meta property="og:image" content="preview.jpg">

Inject Body Code

<!-- Tracking pixel -->
<img src="https://track.example.com/open?id=123" width="1" height="1">

Export

Code injected in correct locations

Batch Export

Export multiple emails:

Select emails to export (checkbox)
Click “Batch Export”
Choose format
Download as .zip with all emails

Perfect for: Template libraries, campaign series

Testing Exports

Before Upload

Always test exports:

Send test email to yourself

Check on mobile device

Test in primary email clients

Verify links work

Check ESP variables render correctly

Email Preflight

Test on 30+ devices before export

Troubleshooting

Variables not working in ESP

Problem: ESP doesn’t recognize variablesSolutions:

Verify correct syntax for your ESP
Check variable names match ESP fields
Ensure variables not accidentally encoded
Test with simple variable first

Layout broken in Outlook

Problem: Email looks wrong in OutlookSolutions:

Re-export with “Outlook optimization” enabled
Ensure table-based layout
Check conditional comments intact
Avoid flexbox/grid CSS

Images not displaying

Problem: Images broken after uploadSolutions:

Use absolute URLs (not relative)
Host images on CDN
Check image URLs accessible
Use Migma’s CDN (automatic)

Dark mode issues

Problem: Unreadable in dark modeSolutions:

Enable “Dark mode styles” in export
Test with Email Preflight
Use dark-mode-safe colors

Next Steps

Platform Integrations

Setup ESP integrations

Email Preflight

Test before export

Sending Emails

Send directly from Migma

API Export

Automate exports via API

Need Help?

Watch Tutorial

Export walkthrough video

ESP Guides

Platform-specific guides

Join Discord

Get export help

Contact Support

Expert export assistance

Getting started

Creating emails

Email editor

Campaigns

Audience

Content hub

Integrations

Advanced features

Case studies

FAQ

Settings

About

​Overview

No Vendor Lock-In

ESP Variables

Universal Compatibility

​Export Formats

​1. HTML (Email-Safe)

​2. React Email

​3. MJML

​ESP-Specific Variables

​How Migma Handles Dynamic Variables

​How to Use ESP Variables

​During Email Creation

​In Visual Editor

​Export Process

​Direct ESP Export

Mailchimp

Klaviyo

HubSpot

Custom Webhook

Platform Integrations

​Email Client Compatibility

​How Migma Ensures Compatibility

​Download Options

​File Formats

​Copy Options

Copy HTML

Copy Inline

Copy Preview

​Advanced Export Features

​Custom Code Injection

​Batch Export

​Testing Exports

​Before Upload

Email Preflight

​Troubleshooting

​Next Steps

Platform Integrations

Email Preflight

Sending Emails

API Export

​Need Help?

Watch Tutorial

ESP Guides

Join Discord

Contact Support

Overview

Export Formats

1. HTML (Email-Safe)

2. React Email

3. MJML

ESP-Specific Variables

How Migma Handles Dynamic Variables

How to Use ESP Variables

During Email Creation

In Visual Editor

Export Process

Direct ESP Export

Email Client Compatibility

How Migma Ensures Compatibility

Download Options

File Formats

Copy Options

Advanced Export Features

Custom Code Injection

Batch Export

Testing Exports

Before Upload

Troubleshooting

Next Steps

Need Help?