Optimizing Your Email Templates For Air

Optimizing Your Email Templates For Air

We prepared this checklist to support your migration to Delivra's Air platform. These email template tips will make your experience seamless, allowing you to be sending your emails from Air quickly. We recommend checking these items in the Air platform, as soon as possible.

Template Styling

Recommendation: Save formatting preferences to the Style tab

Verify that the Style tab is set up properly for your email templates, before editing individual cell styles to make them appear the way you want. This will ensure consistent formatting throughout the email. You'll find these settings by opening your email template in the drag-and-drop designer in Air, then clicking the Style tab in the top-right corner of your editor:


Not only can you set background colors and file width here, you can save global style settings for text, hyperlink color, and buttons as well. 

Tips
  1. Saving style settings in the Style tab makes it easier apply changes similar elements. For example, if you want to change the button color for all buttons, you would only need to make the change in the Style tab, instead of editing each individual button in the editor. Watch a quick video here.
    1. For styling that only applies to 1-2 elements, but not all like elements, it’s recommended to use individual cell styling instead. For example, if you design buttons to have a unique fill color for each one, it would be more efficient to style that individually. But, you can still save time and ensure consistency by saving button height & width in Style tab. 
  2. Consistent text formatting is especially important in text-heavy emails. Set up the font, size, and color for the Header, Sub-header, Section header, and body text in the Style tab. Saving this formatting in the Style tab of your email template instead of editing individual text cells will ensure consistency. 

     


Cell Groups

  1. Check that your email templates do not use Legacy Cell Groups. Any sections that use these have to be recreated using the Air designer. If you're not sure if Cell Groups are present in your design, open your email template, then click on each cell to see if "Cell Group Style" appears on the right:



  2. Cells can be grouped vertically in the Air designer by clicking on the Move Cell icon and dragging the cell towards another cell you want to group it with. Watch a quick video on merging cells and other quick actions.
  3. The Air designer offers layout rows with multiple cells across like Half, Thirds, Left Third, Right Third and Six Column.
    1. You can customize the columns for Six Column layouts. Click the row to display the Row Style editor and find Layout Configuration:

       
  4. Rows with multiple columns will stack on mobile by default (left-to-right). This can be turned off by clicking the row to bring up the Row Style editor:




Images

Cells that have images placed inside text boxes that were made in the Legacy designer have a tendency to render too large on mobile when sent from Air. This is commonly seen in cells with multiple social icon images that are placed in a single text cell.

Tips
  1. Use the Social Follow/Share elements provided in the Air designer to replace any social media icon images. Learn how to insert and customize your Social icons.
  2. If your design requires use of multiple images across, we recommend that you use separate image cells instead of inserting multiple images into a text cell.


Previews

Recommendation: Check both desktop and mobile previews, and test to both of these environments too.

  1. The Air designer offers and in-app preview of Desktop and Mobile.


  2. Delivra offers in-app inbox previews that allow you to test to multiple email clients and environments. Learn more here.
  3. Outlook is known to have quirks that are unique such as ignoring button radius, having white horizontal lines between sections, etc. It’s good to check Outlook previews to make sure the email renders properly.
  4. Stacking on mobile can rearrange the layout that you see in Desktop previews. Make sure to check that the sections using  multiple column layouts are rendering as expected.

Snippets

To prevent any rendering issues, apply all of the above recommendations to Snippets, if those Snippets were created in Legacy.

    • Related Articles

    • Transitioning from Legacy to Delivra Air: What to Expect

      Moving to Delivra Air brings a more streamlined, modern experience without losing access to your data or disrupting your current workflows. This guide highlights what you can expect when switching from our Legacy platform to Delivra Air, focusing on ...