Skip to main content

HTML Email

Build a web page to send via email.

Use the HTML Email Page Layout and its accompanying content types to assemble a page optimized for web email clients. The process starts like any other page you'd create in TerminalFour:

  1. Create a Section
  2. In the section's Page Layouts tab, choose the HTML Email page layout.
  3. Add the HTML Email Config content type, and set up the header and footer.
  4. Add one or more of the HTML Email content types (the names all start with "HTML Email")
  5. Test the results by sending the page to your email address.
  6. If satisfied with the results, use the HTML Email Manager to send it out.

Here's a sample page that uses all of the HTML Email content types currently available.

Page Layout Options

The HTML Email Config content type can be used to set up a custom header image, display the publication date and a link to your site, add a custom subheader, and configure privacy policy, unsubscribe, and contact information in the footer.

You can select the standard header image from the T4 Media Library, or create one of your own. If you're creating your own, the width dimensions should be 600 pixels. The standard header is in the Media Library's Public > Site Navigation > Backgrounds category. Filter for "html email" to find it.

More HTML Email Content Types

Web email cliients don't have the capabilities of modern web browsers, so we're limited to fairly basic HTML in our display. Things like accordion lists and image carousels aren't going to be possible to use here, as they would depend on CSS and Javascript that's not supported in email clients like Gmail. But we do have a good range of options to select from that are designed to work within these limits.

HTML Email General Content - This is just like the one we use for a standard web page, with the addition of an optional heading text field. There's also a two-column version of this available: two general content blocks side-by-side.

HTML Email List Item - A simplified version, with an optional heading text field. You can add one or more of these to create a list with thumbnail images.

HTML Email Story Display - We just have the Story List display option here. Select stories from a section or branch, or by tags, to create your story list.

HTML Email Single Event - You would add one or more of these to create an event list. We're still working on a content type that will allow you to create a list of events automatically from a LiveWhale Calendar RSS file. We hope to have that available soon. For now, you'd need to create your event list manually.

HTML Email LiveWhale Events - Include a list of events from the LiveWhale Calendar system - select events by tag, group, and category.

HTML Email  Size Image - This includes a link option for the image.

HTML Email Call to Action - There are two styles available for this (dark gray and light gray backgrounds), and can include text, buttons, or images.

Sending HTML Email

Once your email has been published, you can test the results by copying all of the page content (CTRL+A or Command+A) and pasting that into the body of a Gmail message. Send that to your email address to see how it looks. But don't use Gmail as the source of the message when sending this out to your intended audience. This should only be used for testing purposes. You'll need to use the page URL and the HTML Email Manager to send the message once you're satisfied with the results of your test.

The HTML Email Manager

When you're ready to send your message to a list, login to the HTML Email Manager. You'll need to wait until your page has been published to the www servers, then copy and paste the URL for that page into the form. On the next page, you can review the HTML Email content and text-only content for accuracy. On to the next form, you can either send the HTML source code to yourself, or send the message out to your recipients. The system limits the number of recipients to ten, so this is best suited to email messages sent to a mailing list address. Here you can once again test the email by sending it only to yourself. Be sure the content from your page is rendered correctly when viewed by an email client.

If you're not able to login to the system, please submit a support ticket and we'll add you to the group.

Submit a Web Support Ticket