Skip to content

Designing Traveling Emails

Tip: This section gives you step by step instructions to create a header, footer, and email template.
You can take a short-cut by simply copying a template that is close to what you want and modifying it.

Remember that we are showing you how to create a template, but you may want your template to look very different. Feel free to experiment and create something unique!

There are a few important concepts in the template designer:

  • Grids: You always need to start with a grid. They will provide the structure for your email. There are several different styles to choose from, and you can have as many as you want in a template.
  • Widgets: After you put a Grid on your template, drag a widget to start entering content. This may be images, text, icons, etc.
  • Controls: When you hover over a grid, control buttons will appear on the right side of the grid. When you hover over a widget, the control buttons will appear at the top of the widget.

Create a Header

  1. Click Email Templates under the Templates menu item.
  2. Click Headers.
  3. Click Add Header.
  4. Give your header a name and set its status to Active.
  5. Click Apply.
  6. Click your header name to begin customizing it.

Screenshot Screenshot Screenshot

Customize Your Header

  1. The canvas is where you will build your headers, footers, and email templates.
  2. Everything in a template is held in a Grid, and there are several different grid formats you can use.
    Each template can have as many grids as needed.
  3. Use Widgets to add content to your template. Widgets will be contained inside grids.
  4. Your template will default to the most common options, but you can customize it here.
  5. Placeholders are replaced with data when the email is sent. This might be your contact information or your client's name, for example.
  6. The other toolbar items are used to customize and format text in your template.
  7. Begin by dragging a grid to the canvas, here we are using the two column grid.
  8. Simply drop it on your canvas.
  9. The blue line indicates where the grid will be placed, which is important when you add your second grid.
  10. Select the Widgets tab.
  11. Drag and drop the Title widget into your first column.
  12. Select the word "Title" then go to the Insert placeholder menu, under Company, and click Company Logo or Name.
  13. Drag the Text widget to the right-hand column.
  14. Select the example text, then go to the Insert placeholder menu and select the contact information you want to include, for example:
    [Agent.FirstName] [Agent.LastName]
    Then select the text again, click the alignment menu and choose the Right Aligned icon.

Screenshot Screenshot Screenshot Screenshot Screenshot Screenshot

Be sure to click Save when you are finished!

Follow the same steps to create a footer.

Create a Template

  1. From the Templates menu click Add Template.
  2. Name your template; clients will not see this so make it something easy to find.
  3. Add a subject, clients will see this; it will be the subject of the email sent to them.
  4. Choose the template type. If this will be related to a trip choose Traveling or Invoice, if it is Marketing choose Client Campaign.
  5. If you are an admin you can choose to share it with your agency.
  6. Select the Header and Footer you just created.
  7. Click Apply to create your template, then click the template name in the list to begin editing it.
  8. Start by dragging a full-width Grid to your template for a cover photo.
  9. Click the Widget tab then drag an Image Widget to your grid.
  10. Click the widget edit button to choose an image.
  11. Click Select under My Images then hover over an image and click Select.
    You can drag and drop additional images inside the dotted line to add images.
  12. Add an image title; this is important for email programs that do not load images, and for visually impaired clients who use screen readers.
    If you want the image to be a link back to your website, add a URL. For example, you may have a blog post that covers this same topic, or a form you want them to fill out.
    Click Apply.
  13. Drag a "Main Right" grid to your template; it will be placed where the blue line shows up.
    Drag an Image widget to the left column and a Text widget to the right column.
    Choose an image, just like the previous step. Add some text and experiment with adding bold text, bullets, and other formatting in the toolbar.
  14. Now drag a Main Left grid and set one up with the opposite spacing.
  15. Finally, add another full grid and drop a Button widget in it.
    Select the edit button on the right then choose the #1 column to set the alignment to Center.
    Select the edit button at the top, add custom text and a custom URL.

Screenshot Screenshot Screenshot Screenshot Screenshot Screenshot Screenshot Screenshot Screenshot

Remember that these are just examples! Experiment and be creative. Create a template that is unique to your style.

Be sure that you have a good mix of text and images for best deliverability.