Email designer basics | Delivra Air

This article provides an overview of the drag-and-drop email designer available in Delivra Air. If you are not a Delivra Air user, please see this article for information about the email designer in the legacy system.

 

Delivra Air offers a modernized email editor that frees you from fussing with email design and makes it ultra-easy to personalize messages for maximum engagement.

 

General Layout

On the left of your page you will find layout elements that can be added into your design. These are categorized into Layout, Content, and Actions:

Layout—Add rows to your design as 1, 2, 3 column formats and pull in Space or Divider elements to create visual space between rows.

Content—Create text and image blocks in your design.

Actions—Create call-to-action buttons in your design.

 

Add Rows & Assign Type

Drag a new layout row (left) into your canvas (center). This will create a new row in your design.

Assign each cell in the new row as a content or action type like Text, Image, or Button. To do this, drag the content or action type icon (left) and drop it in a cell (center).

Shortcut

If the element you’re adding should be in a full-width format, you do not need to first add a full-width layout row. Dragging an element directly into the design will create a 1-column row by default.

 

Duplicate/Remove Rows

Hover over a row to see options to duplicate or remove it from the design layout:

 

Move Rows Up/Down

Hover over a row to see options to move it up or down in the design layout:

Editing Elements

To edit an element in the layout, click on it from the center canvas. This will open the editor for that element type on the right side of your page. Please note that edit options will vary depending on the element type.

Space

Edit options: Adjust height in pixels.

 

Divider

Edit options: Color, height, width, alignment.

 

Text

Edit options: Type (header, body), font family, size, color, text highlight, style (B, I, U), paragraph alignment, bulleted & numbered lists, paragraph indent & outdent, super & sub script, insert image, insert link, insert symbol, insert merge tag, pasted text styling.

 

Image

Edit options: Select/Replace image (insert from image library), alt text, width & height, link image.

 

Button

Edit options: Button color, radius (make button rounded or squared), font family, border, width, height, snap width to text, padding (margin inside button from edge), apply link and link reporting name.

 

Grouping cells

You can easily create a group of cells to control design structure. Hover over a cell to expose quick action icons. Click "move cell" to grab the cell then drag & drop it at the desired location.

 

Additional Formatting

Cell Style

For each cell in your design layout you have additional formatting options available in the Cell Style section:

Here you can:

• Change cell background color
• Insert background image for cell
• Assign a border to cell edges
• Add padding to cell from edge inward
• Assign font family, size & color to all text in cell
• Adjust line spacing
• Adjust horizontal & vertical alignment of content in cell

Template Style

Assign global formatting to the email design in the Style tab.

Here you can:

• Change background color for email
• Insert background image behind design
• Change width of email
• Add a border around design
• Set color for all hyperlinks in the design
• Add padding to email from outside edges inward
• Assign font family, size & color to types of font in design (header, sub-header, etc.)
• Control styling for all buttons in the design
• Add a stylesheet to the design (applicable to mobile)

 

Mobile Preview

From inside the editor you can see a preview for mobile devices. This is provided as a general rendering tool. It's still important to test your campaigns to desktop and mobile devices!

 

Assets/Media Library

An important part of email design is sourcing great images. In the Assets dashboard of your account you can host images in a Media Library. Bulk upload you own images and/or source images from our integration with Unsplash!

 

Resources

Check out these other resources to continue learning.

Delivra Air help articles

Email Designer Basics (e-learning)

Delivra Air Operator's Manual (e-learning)