"email template"
Bootstrap 4.1.1 Snippet by sandipvala

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <!doctype html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <!-- This template is provided for free of charge by Email on Acid, LLC. Every email client is different. See exactly how your email looks in the most popular inboxes, so you can fix any problems before you hit send. https://www.emailonacid.com/ --> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link href="https://fonts.googleapis.com/css?family=Barlow+Condensed:300,400,500,600,700&display=swap" rel="stylesheet"> <style type="text/css"> </style> <!--[if gte mso 9]> <style type="text/css"> .pt-120{ padding-top:230px !important; } </style> <![endif]--> </head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" style="font-family: Georgia, Times, serif"> <table width="100%" border="0" cellspacing="0" cellpadding="0" class="full_wrap"> <tr> <td align="center" valign="top"> <table align="center" width="1400" border="0" cellspacing="0" cellpadding="0" class="main_table" style="width:1400px; table-layout:fixed;"> <tr> <td align="center" valign="top"> <table width="1400" border="0" align="center" class="wrapper"> <!--HEADER SECTION--> <tr> <td align="left" valign="top" bgcolor="#3e4244" style="padding:5px 20px;"> <table border="0" align="left" class="wrapper"> <tr> <td align="center" valign="top" style="padding:10px 0px;"> <img src="[LogoOriginalImage]" width="153" alt="Logo" height="64" style="display:block; max-width:153px;" border="0" /> </td> </tr> </table> <!--<div style="display:none;"> Hej, [UserFullName]!              </div>--> <table width="1000" border="0" align="left" class="wrapper"> <tr> <td align="center" valign="top" style="padding-top:45px;"> <table width="380" border="0" style="color:#ffffff;"> <tr> <!--<td align="center" valign="top" style="font-weight:900;">OM SVØMMEHALLEN</td> <td align="center" valign="top" style="font-weight:900;">ÅBNINGSTIDER</td> <td align="center" valign="top" style="font-weight:900;">NYHEDER</td>--> </tr> </table> </td> </tr> </table> <!--<table border="0" align="right" class="wrapper"> <tr> <td align="center" valign="top" style="padding-top:33px;"> <table border="0" align="center"> <tr> <td width="30" align="center" valign="top" style="padding:0 5px;"> <img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/location.png" style="height: 25px;" /> </td> <td width="30" align="center" valign="top" style="padding:0 5px;"> <img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/phone.png" style="height: 25px;" /> </td> <td width="30" align="center" valign="top" style="padding:0 5px;"> <img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/search.png" style="height: 25px;" /> </td> </tr> </table> </td> </tr> </table>--> </td> </tr> <!--//HEADER SECTION--> <!--BODY SECTION--> <tr> <td align="center" valign="top" style="padding:22px 15px;" bgcolor="#f4f4f4"> <table width="100%" border="0" align="center"> <tr> <td align="center" valign="top"> <table width="100%" border="0"> <tr> <td align="center" valign="top" style="font-size:32px;padding-top:45px;color:#263238;">Hej, [UserFullName]!</td> <td></td> </tr> <tr> <td align="center" valign="top" style="font-size:22px;padding-top:25px;color:#263238;">Tak for dit køb i [AnlaegName]</td> </tr> <tr> <td align="center" valign="top" style="color:#263238; font-size:18px;padding-top:25px;"> <p>Derebekræftelse og billetter af dit køb er vedhæftet som PDF i denne e-mail.<br />Udskriv eller gem PDF’en på din mobile enhed og scan adgangskoden herfra, næste gang du <br />besøger [AnlaegName].</p> </td> </tr> <!--<tr> <td align="center" valign="top" style="font-weight:bolder;font-size:17px;padding-top:25px;">Vi glæder os rigtig meget til at dig!</td> </tr> <tr> <td align="center" valign="top" style="font-size:22px;padding-top:45px;">Din adgangskode er:</td> </tr> <tr> <td align="center" valign="top" style="font-size:34px;padding-top:5px;padding-bottom:45px;">[TempPassword]</td> </tr>--> </table> </td> </tr> <tr> <td align="center" valign="top"> <!-- Wrapper --> <!--<table width="100%" border="0" cellpadding="0" cellspacing="0" align="center"> <tr> <td width="100%" valign="top"> <table background="[OriginalImage]" width="500" class="deviceWidth bgdeviceWidth" border="0" cellpadding="0" cellspacing="0" align="center" style="margin: 0 auto;background-color:[ColorCode];background-position: center center; background-repeat: no-repeat; background-size: cover;"> <tr> <td style="font-size: 20px;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;text-align: center;text-transform: uppercase;letter-spacing: 1px;padding: 25px 0px 0px 0px;color:#ffffff;"> [TicketEventName] <br> </td> </tr> <tr> <td style="font-size: 50px;font-family: 'Barlow Condensed', sans-serif;font-weight: 900;text-align: center;text-transform: uppercase;letter-spacing: 1px;line-height:50px;padding: 15px 0px 0px 0px;color:#ffffff;"> [Title] <br> </td> </tr> <tr> <td style="font-size: 20px;font-family:'Barlow Condensed', sans-serif;font-weight: 600;text-align: center;text-transform: uppercase;letter-spacing: 1px;line-height:25px;padding: 25px 0px 203px 0px;position: relative;color:#ffffff;"> [SportCenterName] <br> [StartDate], [StartTime] - [EndTime] <br> indgang [TotalPriceStr] kr </td> </tr> <tr> <td style="text-align:center;"> <img width="200" src="[LogoOriginalImage]"> </td> </tr> <tr> <td style="font-size: 15px;font-family:'Barlow Condensed', sans-serif;font-weight: 100;text-align: center;padding: 10px 0px 0px 0px;color:#ffffff;"> [SportCenterName]. [Address] </td> </tr> <tr> <td style="padding:25px 0px 25px 0px; text-align: center;"> <img width="120" src="[QRCode]" style="width: 120px;background:#ffffff;padding:5px 5px 5px 5px;"> </td> </tr> </table> </td> </tr> </table>--> <table align="center" class="" width="500" cellpadding="0" cellspacing="0" border="0" style="width:500px;"> <tr> <td class="" valign="top" height="300" background="[OriginalImage]" style="height:600px; background-image:url('[OriginalImage]'); background-repeat:no-repeat; background-position:center;background-size:cover;"> <!--[if gte mso 9]> <v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style="behavior: url(#default#VML); mso-position-horizontal:center; display:block; position: absolute; width: 500px; height: 800px; top: 0; left:0px;border: 0; z-index: 1;" src="[OriginalImage]" /> <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="mso-position-horizontal:center;display:block; position: absolute; width:500px; height: 800px; top: 0; left:0px; border: 0; z-index: 2;"> <v:fill opacity="0%" style="z-index: 1;"/> <div> <![endif]--> <!-- Containing Table --> <table width="100%" cellpadding="0" cellspacing="0" border="0"> <tr> <td class="" align="center" valign="middle" height="300" style="height:300px"> <!-- Contents --> <!-- Headline --> <table width="100%" align="center" cellpadding="0" cellspacing="0" border="0"> <tr> <td style="font-size: 20px;font-family: 'Barlow Condensed', sans-serif;font-weight: 600;text-align: center;text-transform: uppercase;letter-spacing: 1px;padding: 25px 0px 0px 0px;color:#ffffff;"> [TicketEventName] <br> </td> </tr> <tr> <td style="font-size: 50px;font-family: 'Barlow Condensed', sans-serif;font-weight: 900;text-align: center;text-transform: uppercase;letter-spacing: 1px;line-height:50px;padding: 15px 0px 0px 0px;color:#ffffff;"> [Title] <br> </td> </tr> <tr> <td style="font-size: 20px;font-family:'Barlow Condensed', sans-serif;font-weight: 600;text-align: center;text-transform: uppercase;letter-spacing: 1px;line-height:25px;padding: 25px 0px 203px 0px;position: relative;color:#ffffff;"> [SportCenterName] <br> [StartDate], [StartTime] - [EndTime] <br> indgang [TotalPriceStr] kr </td> </tr> <tr> <!--<img id="logoImg" width="200" src="[LogoOriginalImage]">--> <!--[if gte mso 9]> <v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style="behavior: url(#default#VML); display:block; position: absolute;top:410px;bottom:0px; left:180px; border: 0; z-index: 1;height:130px;width:130px;" src="[LogoOriginalImage]" /> <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="display:block; position: absolute; top:410px;bottom:0px; left:180px; border: 0; z-index: 2;"> <v:fill opacity="0%" style="z-index: 1;"/> <div> <![endif]--> <td background="[LogoOriginalImage]" style="width:200px;height:200px; background-image:url('[LogoOriginalImage]'); background-repeat:no-repeat; background-position:center;text-align:center;background-size: 20%;"></td> <!-- Containing Table END--> <!--[if gte mso 9]> </div></v:fill></v:rect><![endif]--> </tr> <tr> <td style="font-size: 15px;font-family:'Barlow Condensed', sans-serif;font-weight: 100;text-align: center;padding: 10px 0px 0px 0px;color:#ffffff;"> [SportCenterName]. [Address] </td> </tr> <tr> <!--<img id="logoImg" width="200" src="[LogoOriginalImage]">--> <!--[if gte mso 9]> <v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style="behavior: url(#default#VML); display:block; position: absolute;top:640px; left:180px; border: 0; z-index: 1;height:130px;width:130px;" src="[QRCode]" /> <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="display:block; position: absolute; top:640px; left:180px; border: 0; z-index: 2;"> <v:fill opacity="0%" style="z-index: 1;"/> <div> <![endif]--> <td background="[QRCode]" style="width:200px;height:200px; background-image:url('[QRCode]'); background-repeat:no-repeat; background-position:center;text-align:center;background-size: 20%;"></td> <!-- Containing Table END--> <!--[if gte mso 9]> </div></v:fill></v:rect><![endif]--> </tr> </table> </td> </tr> </table> <!-- Containing Table END--> <!--[if gte mso 9]> </div></v:fill></v:rect><![endif]--> </td> </tr> </table> <table align="center" style="width:100%; text-align:center;font-size:18px;"> <tr> <td class="pt-120" style="padding-top:30px;color:#263238;">Med venlig hilsen</td> </tr> <tr> <td style="padding-bottom:25px;color:#263238;">[AnlaegName]</td> </tr> </table> <hr style="color:#e1e2e2;width:80%;height:1px;opacity:0.5;" /> <table align="center" style="text-align:center;"> <tr> <td style="padding-top:20px;"><img src="[LogoOriginalImage]" width="150" /></td> </tr> <tr> <td style="padding-bottom:25px;color:#263238;">[AnlaegName] - [Address] [Telephone] - E-mail: [AnlaegEmailId]</td> </tr> </table> <!--<table align="center" style="padding-top:30px;"> <tr> <td><img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/dropbox.png" /></td> <td><img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/facebook.png" /></td> <td><img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/googleplus.png" /></td> <td><img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/linkedin.png" /></td> <td><img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/twitter.png" /></td> <td><img src="https://demo-absalonx.brnd.com/MailTemplateHTML/Ticket_Images/youtube.png" /></td> </tr> </table>--> <hr style="color:#e1e2e2;width:80%;height:1px;opacity:0.5;" /> <table align="center" style="text-align:center;color:#bcc0c1;"> <tr> <td style="padding-bottom:25px;color:#bcc0c1;">Ved at handle hos [AnlaegName], har du accepteret vores handelsbetingelser som du kan finde <a href="[RedirectURL]" target="_blank">her</a></td> </tr> </table> </td> </tr> </table> </td> </tr> <!--//BODY SECTION--> </table> </td> </tr> </table> </td> </tr> </table> </body> </html>
.ReadMsgBody { width: 100%; background-color: #ffffff; } .ExternalClass { width: 100%; background-color: #ffffff; } body { width: 100%; margin: 0; padding: 0; } table { border-collapse: collapse; } @media only screen and (max-width: 640px) { .deviceWidth { width: 440px !important; padding: 0; } .center { text-align: center !important; } } @media only screen and (max-width: 479px) { .deviceWidth { width: 280px !important; padding: 0; } .center { text-align: center !important; } } .bgdeviceWidth { margin: 0 auto; background: url([OriginalImage]); /*background-color:[ColorCode];*/ background-position: center center; background-repeat: no-repeat; background-size: cover; }

Related: See More


Questions / Comments: