Email Templates

Design beautiful, responsive email templates for newsletters, promotions, transactional messages, and automated campaigns. Use our visual drag-and-drop editor or custom HTML/CSS for complete control.

What You Can Create

Newsletters: Regular updates, company news, blog roundups
Promotional Emails: Product launches, sales, special offers, flash deals
Transactional: Order confirmations, receipts, shipping updates, password resets
Nurture Sequences: Welcome series, onboarding, educational content
Event Invitations: Webinars, conferences, product demos
Surveys & Feedback: Customer satisfaction, NPS, reviews

Creating an Email Template

Step 1: Start New Template

Navigate to Channel → Templates
Click + New Template
Select Email as channel
Choose starting point:

Option	Best For	Description
Blank Canvas	Custom designs	Start from scratch with empty template
Pre-built Template	Quick start	Choose from 50+ professional templates
Import HTML	Custom code	Upload your own HTML file
Duplicate Existing	Variations	Copy and modify existing template

Step 2: Design Your Email

Visual Editor (Recommended for Most Users)

Drag-and-drop interface with pre-built blocks:

Content Blocks:

Text: Paragraphs, headings, lists
Image: Single or multiple images, with links
Button: Call-to-action buttons
Divider: Horizontal lines, spacers
Social: Social media icons with links
Video: Embedded video thumbnails
Code: Custom HTML blocks

Layout Blocks:

1 Column: Full-width content
2 Columns: Side-by-side content (50/50)
3 Columns: Three equal columns
2/3 + 1/3: Asymmetric layout
Header: Top banner section
Footer: Bottom section with contact info

Design Settings:

Colors: Brand colors, backgrounds
Fonts: Web-safe fonts, Google Fonts
Spacing: Padding, margins
Alignment: Left, center, right
Border: Radius, width, color

HTML Editor (For Advanced Users)

Full HTML/CSS control:

<!DOCTYPE html>
<html>
<head>
    <style>
        body { font-family: Arial, sans-serif; }
        .container { max-width: 600px; margin: 0 auto; }
        .button {
            background-color: #4CAF50;
            color: white;
            padding: 12px 24px;
            text-decoration: none;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Hello {{contact.first_name}}!</h1>
        <p>Your custom HTML email here...</p>
        <a href="{{link_url}}" class="button">Click Here</a>
    </div>
</body>
</html>

Step 3: Add Personalization

Merge Tags:

Insert dynamic contact data:

Hi {{contact.first_name}},

We noticed you're interested in {{deal.product_name}}.

As a valued customer of {{company.name}}, we're offering you an exclusive 20% discount!

Best regards,
{{user.first_name}}
{{user.job_title}}

Available Fields:

Contact: first_name, last_name, email, phone, job_title, city, country
Company: name, industry, size, website
Deal: name, value, stage, close_date
User: first_name, last_name, email, job_title
Custom: Any custom field names you've created

Conditional Content:

Show/hide content based on contact properties:

{{#if contact.is_vip}}
  <p>As a VIP customer, enjoy free shipping!</p>
{{else}}
  <p>Spend $50+ for free shipping</p>
{{/if}}

Fallback Values:

Provide defaults for empty fields:

Hi {{contact.first_name || 'there'}},

Step 4: Configure Template Settings

Template Details:

Name: Internal identifier (e.g., "Weekly Newsletter - June 2024")
Description: Template purpose
Category: Newsletter, Promotional, Transactional
Tags: For organization

Email Settings:

Subject Line: Default subject (can be overridden in campaign)
Preheader Text: Preview text (85-100 characters)
From Name: Sender name (e.g., "John from Expedify")
From Email: Sender email (verified domain required)
Reply-To: Reply email address

Step 5: Preview & Test

Preview Options:

Desktop View: How it looks on desktop email clients
Mobile View: Mobile rendering
Dark Mode: Dark mode appearance
Sample Data: Preview with test contact data

Test Email:

Click Send Test
Enter test email addresses
Select test contact for merge tag data
Send and review in inbox

Check Before Saving:

✅ All links work
✅ Images load correctly
✅ Mobile responsive
✅ Merge tags formatted correctly
✅ Unsubscribe link present
✅ CTA clear and prominent

Step 6: Save Template

Review all settings
Click Save Template
Template now available for campaigns

Email Design Best Practices

Layout & Structure

Single Column Design:

Best for mobile viewing
Max width: 600px
Full-width on mobile devices

Clear Hierarchy:

Header (logo, navigation)
Hero section (main image/message)
Body content (3-4 sections max)
Call-to-action (primary button)
Footer (unsubscribe, address, social links)

Spacing:

Padding: 20-40px on edges
Line height: 1.5-1.7 for body text
Section spacing: 40-60px between sections

Typography

Font Choices:

Web-safe fonts: Arial, Helvetica, Georgia, Times New Roman, Verdana
Font size: 14-16px for body text, 22-28px for headings
Font weight: Regular for body, bold for headings
Line length: 50-75 characters per line

Readability:

Left-align body text
Center-align headlines (optional)
Avoid all-caps for long text
Use short paragraphs (3-4 lines)

Colors & Branding

Color Scheme:

Primary brand color: CTA buttons, links
Secondary color: Headings, accents
Background: White or light gray (#F4F4F4)
Text: Dark gray (#333333) not pure black

Contrast:

Minimum 4.5:1 contrast ratio for text
Make CTAs stand out with contrasting colors
Use white space effectively

Images

Image Guidelines:

File size: < 200KB per image (optimize!)
Dimensions: 600px wide maximum (2x for retina)
Format: JPG for photos, PNG for graphics/logos
Alt text: ALWAYS include (for when images blocked)

Responsive Images:

<img
  src="image.jpg"
  alt="Product photo"
  width="600"
  style="max-width: 100%; height: auto;"
>

Call-to-Action (CTA)

Button Design:

Size: Minimum 44×44px (tappable on mobile)
Padding: 12-16px vertical, 24-40px horizontal
Color: High contrast, stands out
Text: Action-oriented ("Shop Now" not "Click Here")

Button Code:

<a href="{{link_url}}" style="
  display: inline-block;
  padding: 14px 30px;
  background-color: #4CAF50;
  color: white;
  text-decoration: none;
  border-radius: 6px;
  font-weight: bold;
">
  Shop Now
</a>

CTA Best Practices:

One primary CTA per email
Place above the fold
Repeat CTA at bottom (optional)
Make it obvious and clickable

Mobile Optimization

60% of emails are opened on mobile devices!

Mobile Checklist:

✅ Single column layout
✅ Font size 14px minimum
✅ Large, tappable buttons (44×44px)
✅ Finger-friendly spacing
✅ Responsive images
✅ Short subject lines (30-40 chars)
✅ Brief content (scannable)

Media Queries:

<style>
  @media only screen and (max-width: 600px) {
    .container { width: 100% !important; }
    .button { width: 100% !important; display: block !important; }
    h1 { font-size: 24px !important; }
  }
</style>

Advanced Features

Dynamic Content Blocks

Show different content to different segments:

{{#if contact.industry == "Technology"}}
  <h2>Tech Solutions for Your Business</h2>
  <p>Specialized tools for tech companies...</p>
{{else if contact.industry == "Healthcare"}}
  <h2>Healthcare Compliance Made Easy</h2>
  <p>HIPAA-compliant solutions...</p>
{{else}}
  <h2>Solutions for Every Industry</h2>
  <p>Our versatile platform adapts to your needs...</p>
{{/if}}

Multi-Language Support

Create language variants:

Create base template
Duplicate for each language
Name: Template Name - EN, Template Name - ES
System auto-selects based on {{contact.language}}

A/B Testing

Test different versions:

Subject Line Variations:

Version A: "Save 20% Today!"
Version B: "Exclusive Offer Inside"

Content Variations:

Version A: Image-heavy
Version B: Text-focused

CTA Variations:

Version A: "Shop Now"
Version B: "View Collection"

Compliance & Requirements

Required Elements

Every marketing email MUST include:

Unsubscribe Link (CAN-SPAM requirement)

<p style="font-size: 12px; color: #666;">
  Don't want these emails?
  <a href="{{unsubscribe_url}}">Unsubscribe</a>
</p>

Physical Mailing Address (CAN-SPAM requirement)

<p style="font-size: 12px; color: #666;">
  {{company.name}}<br>
  {{company.address}}<br>
  {{company.city}}, {{company.state}} {{company.zip}}
</p>

Sender Identification

Clear "From" name
Real reply-to address
Company name visible

For EU recipients:

Explicit consent required
Easy unsubscribe
Privacy policy link
Data processing notice

<p style="font-size: 11px; color: #999;">
  You're receiving this because you signed up for our newsletter.
  Read our <a href="{{privacy_url}}">Privacy Policy</a>.
</p>

Template Library

Pre-built Templates Available:

Category	Templates	Use Case
Newsletter	15 layouts	Weekly/monthly updates, content roundups
Promotional	20 layouts	Sales, product launches, limited offers
Transactional	12 layouts	Order confirmations, shipping updates
Welcome Series	8 layouts	Onboarding new subscribers
Event	10 layouts	Webinar invites, conference announcements
Feedback	6 layouts	Surveys, NPS, reviews

Troubleshooting

Common Issues

Problem: Images not displaying

Solution: Check image URLs are absolute (https://), not relative
Solution: Host images on reliable CDN
Solution: File size < 200KB each

Problem: Email looks broken in Outlook

Solution: Use table-based layout for Outlook compatibility
Solution: Avoid CSS features not supported by Outlook
Solution: Test in Litmus or Email on Acid

Problem: Landing in spam folder

Solution: Authenticate domain (SPF, DKIM, DMARC)
Solution: Avoid spam trigger words ("FREE!!!", "ACT NOW!!!")
Solution: Balance text-to-image ratio (60% text minimum)
Solution: Include plain text version

Problem: Low click rates

Solution: Make CTA more prominent
Solution: Reduce number of CTAs (stick to one primary)
Solution: Improve copy and value proposition
Solution: Place CTA above the fold

Best Practices Summary

✅ Do:

Keep it simple and focused
Use single column layout
Test on mobile devices
Include unsubscribe link
Personalize with merge tags
Use action-oriented CTAs
Optimize images
Include alt text
Test before sending

❌ Don't:

Use all-caps subject lines
Overload with images
Forget mobile optimization
Use tiny fonts (< 14px)
Create without testing
Forget unsubscribe link
Use spam trigger words
Make it too long

Campaign Launching → - Send email campaigns
Personalization Guide → - Advanced merge tags
Email Deliverability → - Ensure inbox delivery
A/B Testing → - Optimize templates
Assets Library → - Manage images

What You Can Create​

Creating an Email Template​

Step 1: Start New Template​

Step 2: Design Your Email​

Step 3: Add Personalization​

Step 4: Configure Template Settings​

Step 5: Preview & Test​

Step 6: Save Template​

Email Design Best Practices​

Layout & Structure​

Typography​

Colors & Branding​

Images​

Call-to-Action (CTA)​

Mobile Optimization​

Advanced Features​

Dynamic Content Blocks​

Multi-Language Support​

A/B Testing​

Compliance & Requirements​

Required Elements​

GDPR Compliance​

Template Library​

Troubleshooting​

Common Issues​

Best Practices Summary​

Related Resources​