We've written before about the essential templates email marketer should have on-hand:a letter or text-based template, an invitation template, an announcement or reminder template, a content roundup template, and a product feature template. And the templates are even better when they're automatically responsive on mobile devices. Designers use responsive email templates as a consistent brand foundation, which saves time and improves workflow efficiency. (Can you imagine starting from scratch all the time?!) In this tutorial, we'll first show you some solid examples from big brands, and then we'll walk you through how to mimic and build these essential templates (all mobile responsive) in the BEE editor.
1. Text-based templates
Letter or text-based templates are commonly used to send a personal or serious message to subscribers,like an update to the Privacy Policy or Terms of Service. Check out this email from Airbnb:
A letter or text-based email template is useful for:
- Welcome emails
- Apology messages
- Company or product change announcements
- Privacy policy or terms of service change announcements
- Weekly or routinely sent messages
For letter or text-based email templates, important components to consider including are:
- A standard, branded header/logo
- An easy-to-read email-safe font for the body text
- A call-to-action button
- An e-signature
- A footer
Building a text-based template in BEE
Open up a simple one-column template and begin customizing the template in the Settings menu on the right. This menu will let you make changes for the entire email in one go. Let's change the font to Helvetica, make sure the background colors are white/transparent, and update the links to show up as Airbnb's coral brand color.
Next, recreate the basic structure of the email, which has three basic parts: the logo header, the body text, and the footer separated by a divider.Drag in an image block, followed by two text blocks separated by a divider:
Once you drop in the logo, position it by turning off the auto-width function and making sure it's left-adjusted.
After updating the footer text, the template is ready to go! Now, this letter-style template can be updated by just dropping in the appropriate body text.
2. Invitation-to-join templates
Invitation emails require companies to introduce an offer's value proposition quickly, whether it's joining a webinar or downloading a free e-book. Having a strong invitation template means you'll always have aconsistent way to alert readers to the "what, when, where, and how" of anoffer,so that readers can get the basics in one scan and take action. This email fromSkillshareinvitessubscribers to sign up for new workshops:
An invitation email template is useful for:
- Webinars, conferences, or other reservation-required events
- Lead gen offerings like giveaways or downloads
- New product introductions
For invitation email templates, important components to consider including are:
- A logo/header
- A strong visual image or two (especially of the product)
- A fairly short section providing promotion highlights
- Clear and strong call-to-action language
- A footer
Building a text-based template in BEE
First, in the Settings menu, make sure the email body has a white/transparent background, teal link text, and Helvetica for the font.
Then, pull in the rows that correspond to the layout, from single-column to triple to double, along with content blocks. Here's how the template is shaping up:
Next, update the font color and stylethroughout the email, along withthe CTA buttons (extra button formatting tips can be found here!) so that this template will be easy to update later with copy and images.
3. Announcement/reminder emails
Every marketer needs a template that's ideal for sending out an email, with a single, clear message to readers.While the template might get updated from time to time, it's valuable to have a structured template with a standard width and flow in place. Everlane, for example, always usesthe same header, content dividers, "Radical Transparency" section, and footer for announcement emails.
An announcement email template is useful for:
- Big promotion alerts or reminders
- Product teasers, reveals, or updates
- Event reminders
For announcement email templates, important components to consider including are:
- A standard, branded header/logo
- A placeholder for artwork
- A consistently-formatted section for body text
- A clear call-to-action button
- A footer
Building an announcement email template in BEE
Start by modifying elements in the Settings menu, like an all-white background and aserif font.
Then, use the simple one-column template and bring in three main components: an image placeholder for the logo, an image placeholder for artwork, a CTA button, an image and text bucket for the"Radical Transparency" section, and text for the footer. Let's also add horizontal dividers like Everlane. The skeleton looks like this:
Now, bring in the Everlane logo and the Radical Transparency image; then, format and update the text and CTA button. Here's the template, ready to be updated with the next product announcement:
4. Content roundup emails
A single column, modular design is perfect for content roundups—something any brand should have in their template library. Core77 lists their most popular free classes in a well-organized and well-formatted email,which can be easily repurposed from week to week with new content:
A roundup email template is useful for:
- Product/service lists
- Blog/article digests
For content roundup email templates, important components to consider including are:
- A standard, branded header/logo
- Consistently-formatted modules containing images, text, and CTAs
- A footer
Building a content roundup email template in BEE
This email is especially easy to create in BEE with a sweet little shortcut. To begin, build the header and first module of the email, like so:
Then, copy the first module as many times as needed without having to reformat each time. Simply use the duplicate button in the upper right.
Now, the template is ready to rock-n-roll!
5. Multiple products templates
A product feature email template is a baseline for aregularly-scheduled product offering message that features multiple items.Danner uses a simple template to introduce and remind subscribers about featured boot collections:
A multiple-product email template is useful for:
- Featuring products/services in a photo collage or grid
- Blog/articles organized in a grid
For multiple-product email templates, important components to consider including are:
- A standard, branded header/logo
- A consistently-formatted module highlighting a single product
- A mobile-responsive grid of images featuring additional products
- A call-to-action button
Building a multiple-product roundup email template in BEE
Over in the BEE editor, begin with a basic one-column template. Then, pull in content blocks so the structure is similar starting with a logo image, header text, a header image, text, a CTA button, and on and on.
Once the text and CTA buttons are formatted, the template is ready to go!