Layouts - Headers

Headers are the beginning of your mailing. They typically show an organization logo or the mailing's title. In fact, your mailing's header is one of the first things that your recipients see! With these ideas in mind, let's look at their properties and different types available.

Adding Headers

As with all Template Designer layouts, you can drag and drop your headers onto the canvas. Simply click-and-hold the layout you wish to add, drag your cursor to your desired location, and release.

When you release, your layout becomes part of the template and is ready for editing.

Top-Level Properties

You can set the following top-level properties for all header types:

  • Use Default Background: If checked, your header uses the background color set in the Theme menu. If unchecked, you can use the color picker to select a unique color for the layout’s background.
  • Border: If checked, your header applies a border with several possible settings.
    • Border Style: Click the dropdown to select a solid, dashed, or dotted border.
    • Border Size: Click the dropdown to set the border size in pixels (1-10).
    • Border Color: Click to use the color picker to select a unique color for the layout’s border.
    • Apply Border To: Check the corresponding checkbox for each side (top, bottom, left, and right) that uses the border.

  • Banner: Check to extend your header to the edges of the mailing body.
  • Banded Background: Click the icon that represents your desired “banding” effect.
    • Select Default to keep your layout within the mailing body.
    • Select Banded to extend your layout to the edges of the page.

  • Vertical Align: Click the dropdown list to set a vertical alignment option (top, middle, or bottom).

Additionally, you can set the text and image/logo properties for each area within your header. Please see the text properties and logo properties articles for additional information about how to use their respective editors.

Header Types

There are four types of header that you can add to your template:

  • Full Width Banner (this layout contains a title)
  • Full Width Banner Only
  • Logo on Left
  • Logo Centered
  • Logo with Social Icons

The following subsections define additional functionality for each of these header types.

Full Width Banner

This header contains a text area and a logo area. The logo image spans the length of the header.

Full Width Banner Only

This header is similar to the Full Width Banner, but only contains a logo.

Logo on Left

This header contains a text area and a logo area. The logo image is left-justified.

Logo Centered

This header contains a text area and a logo area. The logo image is center-justified.

Logo with Social Icons

This header contains a text area, a logo area, and a subsection area for the social sharing icons. The logo image is left-justified.

Each of the social sharing icons can be edited using the image/logo properties editor.

Replaceable Header Images?

Though you'll commonly create headers as a static part of your template, you can make them customizable by mailing creators with Mailing Cotent Areas! Check out the video below to learn how.