Good2Go HTML Email Coding

In this example below you will see how to do a Good2Go HTML Email Coding with some HTML / CSS and Javascript

Thumbnail
This awesome code was written by gbjack, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright gbjack ©
  • HTML
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>Good2Go HTML Email Coding</title>
  
  
  
  
  
</head>

<body>

  <html lang="en">
<head>
<title></title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<style type="text/css">
	#outlook a{padding:0;}
    .ReadMsgBody{width:100%;} .ExternalClass{width:100%;}
    .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}
	.appleBody a {color:#00A4E4; text-decoration: none;}
    .appleFooter a {color:#00A4E4; text-decoration: none;}
    body, table, td, a{-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;}
    table, td{mso-table-lspace:0pt; mso-table-rspace:0pt;}
    img{-ms-interpolation-mode:bicubic;}
	body{margin:0; padding:0;}
    img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}
    table{border-collapse:collapse !important;}
    body{height:100% !important; margin:0; padding:0; width:100% !important;}
	@media screen and (max-width: 525px) {
		table[class="emailto100pc"]{width:100% !important;}	
		table[class="emailt80pc"]{width:80% !important;}	
		img[class="emailimgto100pc"]{width:100% !important;}
		a[class="mobile-button"]{width:80% !important; padding: 20px !important; border: 0 !important; font-size: 18px !important; text-decoration:none !important;}
		span[class="mobile-hide"]{display: none !important;}
	}
</style>
</head>
<body style="margin:0; padding:0;">
<table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
	<tr>
		<td align="center">
            <div style="display: none; font-size: 1px; color: #fefefe; line-height: 1px; font-family: Helvetica, Arial, sans-serif; max-height: 0px; max-width: 0px; opacity: 0; overflow: hidden;">
                Protect yourself this summer holiday with the right travel insurance
            </div>
            <table border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" width="550" class="emailto100pc">
            	<tr>
            		<td align="left">
                    	<a href="https://good2gotravelinsurance.com.au/good2go/Content/International-Travel-Insurance.aspx" target="_blank">
                            <img src="http://www.mnahost.com/singapore/img/logo.gif" alt="Good2Go logo" width="220" height="90" style="display:block; border:none;">
                        </a>
                    </td>
            	</tr>
                <tr>
                	<td>
                    	<img src="http://www.mnahost.com/singapore/img/hero.jpg" alt="Choice recommended" width="550" height="350" style="display:block; border:none;" class="emailimgto100pc">
                    </td>
                </tr>
            </table>
		</td>
	</tr>
</table>
<table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
	<tr>
		<td align="center" style="padding:0 22px 0 22px;">
        	<table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="500" class="emailto100pc">
            	<tr>
            		<td align="center">
                    	<table border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                            	<td align="center" style="padding:20px 20px 10px 20px;">
                                    <span style="font-family:Arial, Helvetica, san-serifs; font-size:21px; color:#333333;">
                                        Protect yourself this summer holiday with
                                    </span>
                                </td>
                            </tr>
                            <tr>
                            	<td align="center" style="padding:0px 20px 30px 20px;  color:#333333;">
                                    <span style="font-family:Arial, Helvetica, san-serifs; font-size:38px;">
                                        The Right Travel Insurance
                                    </span>
                                </td>
                            </tr>
                            <tr>
                            	<td>
                               	  <img src="http://www.mnahost.com/singapore/img/header-closer.gif" alt="table graphic" width="500" height="20" style="display:block; border:none;" class="emailimgto100pc">
                                </td>
                            </tr>
                        </table>
                        <table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td valign="top" style="padding: 0px; margin: 0px; line-height: 20px; font-size: 20px;" height="20" bgcolor="#EBECEC">&nbsp;</td>
                        	</tr>
                        </table>
                        <table border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:16px; color:#333333; padding:25px 25px 0 25px;">
                                	Sadly, some holidays don’t always go as planned. When you set off on a well earned summer break you’ll have bags packed, accommodation booked and picture yourself soaking up the sun on that idyllic beach resort a million miles from bright lights big city.
                                </td>
                        	</tr>
                            <tr>
                        		<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:16px; color:#333333; padding:25px 25px 0 25px;">
                                	The last thing on your mind is getting hurt, falling ill or losing your luggage on route to your dream destination.
                                </td>
                        	</tr>
                            <tr>
                        		<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:16px; color:#333333; padding:25px 25px 25px 25px;">
                                	Protect yourself from the unthinkable by understanding which travel insurance policies offer what type of benefits &#8211; because not all travel insurance is created equal.
                                </td>
                        	</tr>
                            <tr>
                            	<td align="center" bgcolor="#EBECEC">
                                	<img src="http://www.mnahost.com/singapore/img/arrow.gif" alt="Arrow" width="36" height="23" style="display:block; border:none;">
                                </td>
                            </tr>
                        </table>
                        <table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="center" valign="top" style="padding: 0px; margin: 0px; line-height: 20px; font-size: 20px;" height="20" bgcolor="#EBECEC">&nbsp;</td>
                        	</tr>
                        </table>
                        <table border="0" bgcolor="EBECEC" cellpadding="0" cellspacing="0" width="100%">
                        	<tr>
                            	<td align="center" bgcolor="#EBECEC">
                               	  <table border="0" cellspacing="0" cellpadding="0" class="emailt80pc">
                                        <tr>
                                            <td align="center" bgcolor="#0073AE">
                                                <a href="https://good2gotravelinsurance.com.au/good2go/Content/International-Travel-Insurance.aspx" target="_blank" style="font-family: Helvetica, Arial, sans-serif; font-size: 18px; font-weight: bold; color: #FFFFFF; text-decoration: none; background-color: #0073AE; border-top: 15px solid #0073AE; border-bottom: 15px solid #0073AE; border-left: 35px solid #0073AE; border-right: 35px solid #0073AE; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; display: inline-block;" class="mobile-button">
                                                    <span style="text-decoration:none;">
														Choose The Right Policy
                                                    </span>
                                                </a>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                            </tr>
                        </table>
                        <table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="center" valign="top" style="padding: 0px; margin: 0px; line-height: 20px; font-size: 20px;" height="20" bgcolor="#EBECEC">&nbsp;</td>
                        	</tr>
                        </table>
                        <table border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:16px; color:#333333; padding:25px 25px 0 25px;">
                                	Good2Go is the smarter option for Travel Insurance. Purchase online and choose from a range of cover to suit every type of budget, for international or domestic travel. And to back up our promise, Good2Go The Works has just been named the CHOICE Recommended Travel Insurance product for the 4<sup>th</sup> year running, in their Annual Travel Insurance Review.
                               </td>
                           </tr>
                           <tr>
                        		<td align="center" style="font-family:Arial, Helvetica, san-serifs; font-size:18px; font-weight:bold; font-style:italic; color:#333333; padding:25px 25px 25px 25px;">
                                	“Good2Go The Works has among the highest <span class="mobile-hide"><br></span>features scores with the lowest tier price rating. <span class="mobile-hide"><br></span>It’s among the best value travel insurance <span class="mobile-hide"><br></span>for the fourth year running” 
                               </td>
                           </tr>
                           <tr>
                            	<td align="center" bgcolor="#EBECEC">
                                	<img src="http://www.mnahost.com/singapore/img/arrow.gif" alt="Arrow" width="36" height="23" style="display:block; border:none;">
                                </td>
                          </tr>
                        </table>
                        <table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="center" valign="top" style="padding: 0px; margin: 0px; line-height:20px; font-size:20px;" height="20" bgcolor="#EBECEC">&nbsp;</td>
                        	</tr>
                        </table>
                        <table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="center" bgcolor="#EBECEC">
                                	<table border="0" cellspacing="0" cellpadding="0" class="emailt80pc">
                                        <tr>
                                            <td align="center" bgcolor="#0073AE">
                                                <a href="https://good2gotravelinsurance.com.au/good2go/Content/International-Travel-Insurance.aspx" target="_blank" style="font-family: Helvetica, Arial, sans-serif; font-size: 18px; font-weight: bold; color: #FFFFFF; text-decoration: none; background-color: #0073AE; border-top: 15px solid #0073AE; border-bottom: 15px solid #0073AE; border-left: 80px solid #0073AE; border-right: 80px solid #0073AE; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; display: inline-block;" class="mobile-button">
                                                    <span style="text-decoration:none;">
                                                        Purchase Now
                                                    </span>
                                                </a>
                                            </td>
                                        </tr>
                                    </table>
                                </td>
                        	</tr>
                        </table>
                        <table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="center" valign="top" style="padding: 0px; margin: 0px; line-height:20px; font-size:20px;" height="20" bgcolor="#EBECEC">&nbsp;</td>
                        	</tr>
                        </table>
                        <table border="0" bgcolor="#00A4E4" cellpadding="0" cellspacing="0" width="100%">
								<tr>
									<td valign="top" style="padding: 0px; margin: 0px; line-height: 3px; font-size: 3px;" height="3" bgcolor="#00A4E4">&nbsp;</td>
								</tr>
						</table>
                        <table border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" width="100%">
                        	<tr>
                        		<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:16px; color:#333333; padding:25px 25px 0 25px;">
                                	As part of your cover you’ll also receive Travel Guard protection, complete with 24hr emergency assistance and access to a worldwide team of doctors and medical professionals.
                               </td>
                           </tr>
                           <tr>
                           	<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:16px; color:#333333; padding:25px 25px 25px 25px;">
                            	<strong>Any questions?</strong> 
                               <br>
                               Call us on <a href="tel:1300-290-217" style="text-decoration:none; color:#00A4E4; font-weight:bold;">1300 290 217</a> between 8am &#45; 6pm AEST <span class="mobile-hide"><br></span>(Monday &#45; Friday) or email us at <a href="mailto:traveladmin@aig.com" target="_blank" style="text-decoration:none; color:#00A4E4; font-weight:bold;">traveladmin@aig.com</a>
                            </td>
                           </tr>
                       </table>
                       <table border="0" bgcolor="#EBECEC" cellspacing="0" cellpadding="0" width="100%">
                       		<tr>
                       			<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:12px; color:#333333; padding:25px 0 0 0;">
                                	<a href="https://good2gotravelinsurance.com.au/good2go/Content/International-Travel-Insurance.aspx" target="_blank" style="text-decoration:none; color:#00A4E4;">Good2Go Travel Insurance</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="http://www.aig.com.au/privacy" target="_blank" style="text-decoration:none; color:#00A4E4;">Privacy Policy</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="#" target="_blank" style="text-decoration:none; color:#00A4E4;">View in Browser</a>	
                                </td>
                       		</tr>
                            <tr>
                            	<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:12px; text-align:justify; color:#333333; padding:15px 0 0 0;">
                                	*Full details of benefits, terms, conditions and exclusions that may apply to Good2Go Travel Insurance are specified in the Product Disclosure Statement (PDS) and Policy Wording. You should read the PDS to ensure that the cover provided meets your personal needs and objectives prior to making any decision to acquire the product. The Good2Go logo is a registered trademark. Insurance products and services are provided by AIG Australia Limited (AIG) ABN 93 004 727 753, AFSL 381686. The information provided is purely for factual advice only. AIG disclaims all liability for any loss, damage or liability in relation to the information provided. 15/00126
                                </td>
                            </tr>
                            <tr>
                            	<td align="left" style="font-family:Arial, Helvetica, san-serifs; font-size:12px; text-align:justify; color:#333333; padding:15px 0 25px 0;">
                                	Copyright &copy; 2015 AIG Australia Limited. All rights reserved. 717 Bourke Street, Melbourne Vic 3008. This email was sent to <a href="mailto:rmimmo@indsoc.com.au" style="text-decoration:none; color:#00A4E4;">rmimmo@indsoc.com.au</a>. If you do not wish to receive messages like this one in the future, please <unsubscribe style="color:#00A4E4; text-decoration:none;">click here</unsubscribe>.
                                </td>
                            </tr>
                       </table>
                    </td>
            	</tr>
            </table>
        </td>
	</tr>
</table>
</body>
</html>
  
  

</body>

</html>

Comments