Email size & responsive options

Configure email width, sizing, and responsive design settings to ensure your newsletter displays correctly across different screen sizes and email clients.

Set email width

1. Open a newsletter or template draft.
2. Access Settings, Design, or Email Settings (TODO: confirm exact menu/tab label).
3. Look for an Email Width or Max Width option.
4. Choose a preset width or enter a custom value in pixels (common widths: 600px, 800px).
5. Save the setting.

Enable responsive design

1. In the same settings area, look for Responsive Design or Mobile Optimization.
2. Toggle On to enable responsive behavior (TODO: confirm if this is a boolean toggle or has sub-options).
3. Letterhead will automatically adjust layout and font sizes for smaller screens.
4. Save the setting.

Configure mobile breakpoints (if available)

1. Look for Breakpoints or Mobile Settings (TODO: confirm if this option exists).
2. Set the breakpoint width (typically 480px or 600px for mobile).
3. Define mobile-specific styles (e.g., full width, stacked layout) if the UI allows.
4. Save.

Preview on different devices

1. In the editor, look for a Preview dropdown or button.
2. Select from preset device views:
   • Desktop (full width)
   • Tablet (medium width)
   • Mobile (small width)
3. Verify layout and readability on each view.
4. Adjust blocks or spacing if content appears cramped or misaligned on mobile.

Padding and spacing

1. Select a block or section in the editor.
2. Adjust Padding or Margin values (TODO: confirm if these are separate or combined).
3. Consider tighter spacing on mobile; you may want different padding rules for desktop vs. mobile.
4. Use responsive settings or custom CSS to apply mobile-specific spacing if needed.

Test across email clients

1. After configuring width and responsiveness, send a test email to yourself.
2. Open the email in multiple clients (Gmail, Outlook, Apple Mail, Yahoo, etc.).
3. Verify widths, spacing, and text wrapping on each.
4. Make adjustments if any client displays the email incorrectly.

Save as template

Once you’ve configured email size and responsive options:

1. Click Save as Template (TODO: confirm button label).
2. Name the template (e.g., “Standard Responsive 600px”).
3. Reuse this template for future newsletters with the same settings.

Next steps

• Design newsletters with your size settings in mind.
• Add custom CSS for advanced responsive styling.
• Create templates to save and reuse size configurations.