Skip to content

Instantly share code, notes, and snippets.

@assafelovic

assafelovic/template.html

Created September 23, 2017 15:14
Show Gist options
  • Star 3 You must be signed in to star a gist
  • Fork 1 You must be signed in to fork a gist
  • Save assafelovic/f9b6359403f9f48b0002abc8d50b9b35 to your computer and use it in GitHub Desktop.
Save assafelovic/f9b6359403f9f48b0002abc8d50b9b35 to your computer and use it in GitHub Desktop.
Download ZIP
Dynamic email template in pure html
Raw
template.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<title>Automatic Email</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body style="margin:0; padding:10px 0 0 0;" bgcolor="#F8F8F8">
<table align="center" border="1" cellpadding="0" cellspacing="0" width="95%%">
<tr>
<td align="center">
<table align="center" border="1" cellpadding="0" cellspacing="0" width="600"
style="border-collapse: separate; border-spacing: 2px 5px; box-shadow: 1px 0 1px 1px #B8B8B8;"
bgcolor="#FFFFFF">
<tr>
<td align="center" style="padding: 5px 5px 5px 5px;">
<a href="http://url-goes-here" target="_blank">
<img src="http://logo.png" alt="Logo" style="width:186px;border:0;"/>
</a>
</td>
</tr>
<tr>
<td align="center">
<!-- Initial relevant banner image goes here under src-->
<img src="%s" alt="Image Banner" style="display: block;border:0;" height="100%%" width="600"/>
</td>
</tr>
<tr>
<td bgcolor="#ffffff" style="padding: 40px 30px 40px 30px;">
<table border="1" cellpadding="0" cellspacing="0" width="100%%">
<tr>
<td style="padding: 10px 0 10px 0; font-family: Avenir, sans-serif; font-size: 16px;">
<!-- Initial text goes here-->
%s
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td bgcolor="#E8E8E8">
<table border="1" cellpadding="0" cellspacing="0" width="100%%" style="padding: 20px 10px 10px 10px;">
<tr>
<td width="260" valign="top" style="padding: 0 0 15px 0;">
<table border="1" cellpadding="0" cellspacing="0" width="100%%">
<tr>
<td align="center">
<a href="tel:phone number goes here" target="_blank">
<img src="url for call image goes here.png" alt="Call us"
style="display: block;"/>
</a>
</td>
</tr>
<tr>
<td align="center"
style="font-family: Avenir, sans-serif; color:#707070;font-size: 13px;padding: 10px 0 0 0;">
GIVE US A CALL
</td>
</tr>
</table>
</td>
<td style="font-size: 0; line-height: 0;" width="20">
&nbsp;
</td>
<td width="260" valign="top">
<table border="1" cellpadding="0" cellspacing="0" width="100%%" >
<tr>
<td align="center">
<a href="mailto:emailgoeshere@gmail.com">
<img src="url for email image goes here" alt="Email us"
style="display: block;"/>
</a>
</td>
</tr>
<tr>
<td align="center"
style="font-family: Avenir, sans-serif; color:#707070;font-size: 13px;padding: 10px 0 0 0;">
EMAIL US
</td>
</tr>
</table>
</td>
<td style="font-size: 0; line-height: 0;" width="20">
&nbsp;
</td>
<td width="260" valign="top">
<table border="1" cellpadding="0" cellspacing="0" width="100%%">
<tr>
<td align="center">
<a href="url to faq page goes here" target="_blank">
<img src="url for faq image goes here" alt="FAQ Page"
style="display: block;"/>
</a>
</td>
</tr>
<tr>
<td align="center"
style="font-family: Avenir, sans-serif; color:#707070;font-size: 13px;padding: 10px 0 0 0;">
BROWSE FAQ PAGE
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td bgcolor="#66989c" style="padding: 15px 15px 15px 15px;">
<table border="1" cellpadding="0" cellspacing="0" width="100%%">
<tr>
<td align="center">
<table border="1" cellpadding="0" cellspacing="0">
<tr>
<td>
<a href="facebook url goes here" target="_blank">
<img src="facebook image goes here" alt="Facebook" width="50" height="50"
style="display: block;" border="1"/>
</a>
</td>
<td style="font-size: 0; line-height: 0;" width="20">&nbsp;</td>
<td>
<a href="youtube page link goes here" target="_blank">
<img src="youtube image link goes here" alt="Youtube" width="50" height="50"
style="display: block;" border="1"/>
</a>
</td>
<td style="font-size: 0; line-height: 0;" width="20">&nbsp;</td>
<td>
<a href="twitter page goes here" target="_blank">
<img src="twitter image goes here" alt="Twitter" width="50" height="50"
style="display: block;" border="1"/>
</a>
</td>
<td style="font-size: 0; line-height: 0;" width="20">&nbsp;</td>
<td>
<a href="linkedin page goes here" target="_blank">
<img src="linkedin image goes here" alt="Linkedin" width="50" height="50"
style="display: block;" border="1"/>
</a>
</td>
<td style="font-size: 0; line-height: 0;" width="20">&nbsp;</td>
<td>
<a href="home page goes here" target="_blank">
<img src="homepage image goes here" alt="GreenIQ" width="50" height="50"
style="display: block;" border="1"/>
</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment