Skip to content

Instantly share code, notes, and snippets.

@julioberina

julioberina/coffee-bean-promotion-html-email.markdown

Created August 25, 2018 02:33
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save julioberina/37f6a928f1d798cb8e93833ac6db4164 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save julioberina/37f6a928f1d798cb8e93833ac6db4164 to your computer and use it in GitHub Desktop.
Download ZIP
Coffee Bean Promotion HTML Email
Raw
index.html
<!-- HTML Email -->
<table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td>
<!-- Container for HTML Email -->
<table cellspacing="0" cellpadding="0" border="0" width="600" align="center" style="background-color: white;">
<!-- Logo row -->
<tr>
<td>
<table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td align="center" style="padding: 22px;">
<img style="width: 320px;" src="https://www.dropbox.com/s/fwnhtkymuqvhzt3/logo.png?raw=1" alt="Logo">
</td>
</tr>
</table>
</td>
</tr>
<!-- Party row -->
<tr>
<td>
<table cellspacing="0" cellpadding="0" border="0" width="100%">
<tr>
<td><img src="https://www.dropbox.com/s/r1w03a8c4impuds/party.gif?raw=1"></td>
</tr>
</table>
</td>
</tr>
<!-- Find a store row (part 1) -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td align="center" style="padding-top: 40px; padding-left: 25px; padding-right: 25px;">
<span style="font-weight: bold; font-size: 28px; font-family: montserrat, sans-serif;">
Let's Party Like It's Our Birthday
</span>
<span style="font-family: nunito, sans-serif; line-height: 2; text-align: center; padding: 10px; color: #666666;">
<p>
It's our 55th birthday and we're celebrating with you. This week from Monday-Friday, buy any large iced drink and get another one FREE. Valid at participating stores from 2-6pm.
</p>
</span>
</td>
</tr>
</table>
</td>
</tr>
<!-- Find a store row (part 2 includes button) -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td align="center" style="padding-bottom: 120px;">
<a href="#" style="text-transform: uppercase; font-family: montserrat, sans-serif;
font-size: 12px; letter-spacing: 2px; text-align: center;
background-color: #532d6d; padding: 10px 20px 10px 20px;
color: white; text-decoration: none; font-weight: bold;">Find a store</a>
</td>
</tr>
</table>
</td>
</tr>
<!-- Need Inspiration row -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" align="center" style="font-family: montserrat, sans-serif; text-transform: uppercase;
letter-spacing: 2px; padding-bottom: 20px; font-size: 16px;">
<tr>
<td>
<strong>Need Inspiration?</strong>
</td>
</tr>
</table>
</td>
</tr>
<!-- Adventurer row -->
<tr>
<td>
<!-- Picture for adventurer coffee -->
<table cellpadding="0" cellspacing="0" border="0" width="50%" align="left" style="padding: 10px;">
<tr>
<td>
<img src="https://www.dropbox.com/s/1vj68jml88zrx1c/adventurer.jpg?raw=1" alt="Adventurer">
</td>
</tr>
</table>
<!-- Description for adventurer coffee -->
<table cellpadding="0" cellspacing="0" border="0" width="50%" align="right" style="padding: 40px 30px 20px 30px;">
<tr>
<td style="font-family: montserrat, sans-serif;">
<span style="font-size: 16px; color: #532d6d;">
<strong>For the Adventurer</strong>
<p style="font-family: nunito, sans-serif; color: #666666; font-weight: normal;
font-size: 15px; line-height: 1.5;">
Love trying new things? Then you'll enjoy our new and improved Iced Matcha Latte.
We start with ceremonial grade matcha blended with our classic vanilla powder for
a brighter, more enhanced matcha flavor than ever before.
</p>
</span>
<a href="#" style="text-decoration: none; color: white; background-color: #532d6d;
text-align: center; letter-spacing: 2px; font-size: 10px;
text-transform: uppercase; padding: 10px 18px 10px 18px;
font-weight: bold;">Get Yours</a>
</td>
</tr>
</table>
</td>
</tr>
<!-- Fitness Fanatic row -->
<tr>
<td>
<!-- Picture for fitness fanatic coffee -->
<table cellpadding="0" cellspacing="0" border="0" width="50%" align="left" style="padding: 10px;">
<tr>
<td>
<img src="https://www.dropbox.com/s/hb88xm0j7pyresu/fitnessfanatic.jpg?raw=1" alt="Adventurer">
</td>
</tr>
</table>
<!-- Description for fitness fanatic coffee -->
<table cellpadding="0" cellspacing="0" border="0" width="50%" align="right" style="padding: 40px 30px 20px 30px;">
<tr>
<td style="font-family: montserrat, sans-serif;">
<span style="font-size: 16px; color: #532d6d;">
<strong>For the Fitness Fanatic</strong>
<p style="font-family: nunito, sans-serif; color: #666666; font-weight: normal;
font-size: 15px; line-height: 1.5;">
Whether you hike, lift, spin or barre, staying hydrated is key.
Pick up a refreshing Iced Tea brewed from whole premium tea
leaves and sourced from single estate family farms around the world.
</p>
</span>
<a href="#" style="text-decoration: none; color: white; background-color: #532d6d;
text-align: center; letter-spacing: 2px; font-size: 10px;
text-transform: uppercase; padding: 10px 18px 10px 18px;
font-weight: bold;">Find a store</a>
</td>
</tr>
</table>
</td>
</tr>
<!-- Coffee Addict row -->
<tr>
<td>
<!-- Picture for coffee addict coffee -->
<table cellpadding="0" cellspacing="0" border="0" width="50%" align="left" style="padding: 10px;">
<tr>
<td>
<img src="https://www.dropbox.com/s/9s7f57mnf98d6bh/coffeeaddict.jpg?raw=1" alt="Adventurer">
</td>
</tr>
</table>
<!-- Description for coffee addict coffee -->
<table cellpadding="0" cellspacing="0" border="0" width="50%" align="right" style="padding: 40px 30px 20px 30px;">
<tr>
<td style="font-family: montserrat, sans-serif;">
<span style="font-size: 16px; color: #532d6d;">
<strong>For the Coffee Addict</strong>
<p style="font-family: nunito, sans-serif; color: #666666; font-weight: normal;
font-size: 15px; line-height: 1.5;">
Coffee isn't just for mornings. For those 3pm slumps, try our Cold Brew
Coffee, which is brewed in cold water for 20 hours to create a smooth
taste with less acidity. For an even silkier finish, try our Nitro Cold Brew.
</p>
</span>
<a href="#" style="text-decoration: none; color: white; background-color: #532d6d;
text-align: center; letter-spacing: 2px; font-size: 10px;
text-transform: uppercase; padding: 10px 18px 10px 18px;
font-weight: bold;">Find a store</a>
</td>
</tr>
</table>
</td>
</tr>
<!-- Instagram row (part 1 title) -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%"
style="padding: 50px 0px 25px 0px; font-family: Nunito, sans-serif;
font-size: 16px; text-align: center; letter-spacing: 2px;
text-transform: uppercase;">
<tr>
<td align="center"><strong>See more on our Instagram</strong></td>
</tr>
</table>
</td>
</tr>
<!-- Instagram row (part 2 image) -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td>
<img src="https://www.dropbox.com/s/drxtijievttp0xl/drinkcollection.jpg?raw=1" alt="Drink Collection">
</td>
</tr>
</table>
</td>
</tr>
<!-- Instagram row (part 3 button) -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="padding: 30px 0px 70px 0px;">
<tr>
<td align="center">
<a href="#" style="text-transform: uppercase; font-family: montserrat, sans-serif;
font-size: 12px; letter-spacing: 2px; text-align: center;
background-color: #532d6d; padding: 10px 20px 10px 20px;
color: white; text-decoration: none; font-weight: bold;">Follow Us on Instagram</a>
</td>
</tr>
</table>
</td>
</tr>
<!-- Navbar row -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="padding: 0px 73.5px 0px 73.5px;">
<tr>
<td>
<!-- Find a store link -->
<table cellpadding="0" cellspacing="0" border="0" align="left" style="padding: 10px;">
<tr>
<td>
<a style="font-family: montserrat, sans-serif; font-size: 14px; text-decoration: none;
text-transform: uppercase; color: #646464;" href="#">
<strong>Find a store</strong>
</a>
</td>
</tr>
</table>
<!-- Coffee link -->
<table cellpadding="0" cellspacing="0" border="0" align="left" style="padding: 10px;">
<tr>
<td>
<a style="font-family: montserrat, sans-serif; font-size: 14px; text-decoration: none;
text-transform: uppercase; color: #646464;" href="#">
<strong>Coffee</strong>
</a>
</td>
</tr>
</table>
<!-- Tea link -->
<table cellpadding="0" cellspacing="0" border="0" align="left" style="padding: 10px;">
<tr>
<td>
<a style="font-family: montserrat, sans-serif; font-size: 14px; text-decoration: none;
text-transform: uppercase; color: #646464;" href="#">
<strong>Tea</strong>
</a>
</td>
</tr>
</table>
<!-- Rewards link -->
<table cellpadding="0" cellspacing="0" border="0" align="left" style="padding: 10px;">
<tr>
<td>
<a style="font-family: montserrat, sans-serif; font-size: 14px; text-decoration: none;
text-transform: uppercase; color: #646464;" href="#">
<strong>Rewards</strong>
</a>
</td>
</tr>
</table>
<!-- Shop online link -->
<table cellpadding="0" cellspacing="0" border="0" align="left" style="padding: 10px;">
<tr>
<td>
<a style="font-family: montserrat, sans-serif; font-size: 14px; text-decoration: none;
text-transform: uppercase; color: #646464;" href="#">
<strong>Shop online</strong>
</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<!-- Social Media row -->
<tr>
<td>
<table cellpadding="0" cellspacing="0" border="0" width="100%" style="padding: 15px 0px 0px 0px;">
<tr>
<td align="center">
<a href="#" style="padding: 5px; text-decoration: none;">
<img src="https://www.dropbox.com/s/jwjyg3grtn75oy5/instagram.png?raw=1" alt="Instagram">
</a>
<a href="#" style="padding: 5px; text-decoration: none;">
<img src="https://www.dropbox.com/s/hrmg9p6rsgw67z5/twitter.png?raw=1" alt="Twitter">
</a>
<a href="#" style="padding: 5px; text-decoration: none;">
<img src="https://www.dropbox.com/s/ckhr362y81iiapi/facebook.png?raw=1" alt="Facebook">
</a>
<a href="#" style="padding: 5px; text-decoration: none;">
<img src="https://www.dropbox.com/s/3jxob1c24ua6v87/pinterest.png?raw=1" alt="Pinterest">
</a>
</td>
</tr>
</table>
</td>
</tr>
<!-- Offer row -->
<tr>
<td align="center">
<table cellpadding="0" cellspacing="0" border="0"
style="font-family: nunito, sans-serif; font-size: 12px; color: #646464;
line-height: 1.5; text-align: center;">
<tr>
<td style="padding: 10px 10px 0px 10px;">
<p>
Offer valid only at participating The Coffee Bean & Tea Leaf® retail
locations from 2:00 – 6:00 p.m. on 8/13/2018 – 8/17/2018 and 8/20/2018 – 8/24/2018.
Offer for one (1) complimentary large-sized or 32-ounce sized iced beverage of equal
or lesser value with the purchase of one (1) large-size or 32-ounce size iced beverage.
Offer for behind-the-bar beverages only. Limit one (1) offer per customer, per visit.
Cannot be used in conjunction with any other offer, promotion, or discount.
Not valid on previous purchases. No cash value except where required by law. No substitutions.
No rainchecks. Company reserves the right to withdraw, or change, the offer’s terms
and conditions at any time, at Company’s discretion, and without notice.
While supplies last. © 2018 International Coffee & Tea, LLC. All rights reserved.
</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Receiving email row -->
<tr>
<td align="center">
<table cellpadding="0" cellspacing="0" border="0"
style="font-family: nunito, sans-serif; font-size: 12px; color: #646464;
line-height: 1.5; text-align: center;">
<tr>
<td style="padding: 0px 10px 0px 10px;">
<p>
You're receiving this email because you subscribed at
<a href="#">coffeebean.com</a>.
We promise to use your information only according to our privacy policy.
</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Copyright row -->
<tr>
<td align="center">
<table cellpadding="0" cellspacing="0" border="0" width="40%"
style="font-family: nunito, sans-serif; font-size: 12px; color: #646464;
line-height: 1.5; text-align: center;">
<tr>
<td>
<p>
© 2018 International Coffee & Tea, LLC.
5700 Wilshire Blvd Ste 120.<br>
Los Angeles, CA 90036
</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- Unsubscribe row -->
<tr>
<td align="center">
<table cellpadding="0" cellspacing="0" border="0" style="padding: 25px 0px 10px 0px;">
<tr>
<td>
<a href="#" style="font-family: nunito, sans-serif; font-size: 12px;
color: #646464; font-weight: bold;">Unsubscribe</a>
</td>
<td style="font-family: nunito, sans-serif; font-size: 12px;">
&nbsp;&nbsp;|&nbsp;&nbsp;
</td>
<td>
<a href="#" style="font-family: nunito, sans-serif; font-size: 12px;
color: #646464; font-weight: bold;">View in Browser</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment