Who This Is For / When to Use
This article is for marketers, business owners, and teams creating email templates or campaigns who want to optimize email appearance and usability on mobile devices. Use Mobile Formatting when emails look too large, misaligned, or difficult to read on phones.
What Mobile Formatting Does in the Email Builder
Mobile Formatting lets users define mobile-specific styles for headings, paragraphs, and buttons that apply only when an email is viewed on a mobile device. These settings override desktop styles on supported email clients, allowing better readability and layout control on smaller screens.
How to Access Mobile Formatting Settings
Mobile Formatting is accessed from the Appearance settings of an email template or campaign. These controls are only available after opening the Email Builder editor.
Steps:
Open an existing email template or email campaign.
Click the Appearance tab in the left sidebar.
Expand the Mobile Formatting section.
How Mobile Formatting Toggles Work
Each toggle enables mobile-specific styling for a specific element type. When enabled, you can customize how that element appears on mobile without affecting the desktop version.
Available elements:
Heading H1
Heading H2
Heading H3
Paragraph
Button
Disabled toggles use default responsive styles that already scale down for mobile.
How to Customize Mobile Styles
Once a toggle is enabled, you can configure font size, line height, and text alignment for that element on mobile devices.
Common options include:
Font size (recommended: smaller than desktop)
Line height for readability
Text alignment (left, center, right)
These settings apply only to mobile views in supported email clients.
How to Preview the Mobile Version of an Email
Previewing ensures mobile formatting changes render correctly before sending.
Steps:
Click the three-dot menu in the top-right corner of the Email Builder.
Select Preview Template.
Use the device icons at the top to switch between desktop and mobile views.
Mobile Email Formatting Best Practices
Mobile formatting is most effective when combined with responsive email design principles.
Recommended best practices:
Use a single-column layout for clarity.
Keep text concise and scannable.
Use font sizes of at least 16px for body text and 20px for headings.
Ensure buttons are touch-friendly (minimum 44px height).
Place primary CTAs near the middle of the email.
Use sufficient white space to avoid clutter.
Always preview on both desktop and mobile before sending.
Common Issues and Fixes
Mobile styles are not applying
Mobile Formatting only works in email clients that support media queries. Some older or restrictive clients may ignore mobile-specific styles.
Fix: Test across multiple email clients and rely on default responsive styles when necessary.
Text looks too large on mobile
Desktop font sizes can appear oversized on phones if mobile overrides are not enabled.
Fix: Enable the Mobile Formatting toggle for the affected element and reduce the font size.
Buttons are hard to tap on mobile
Small buttons reduce engagement and usability on touch devices.
Fix: Enable Button mobile formatting and increase button height and padding.