<p style="Margin-top:0px;Margin-bottom:15px;line-height:130%;" >
#set ($fwSafetyRecalls = $SafetyRecalls.replace("<br />", "<br /> • "))
• $fwSafetyRecalls
</p>
#set ($fwRecallsUrl = $RecallsUrl.replace("VIN", "vin"))
<p style="Margin-top:0px;Margin-bottom:15px;" ><a href="$fwRecallsUrl" style="text-decoration:none; color:#00b9e5;">click here</a></p>
Code copied!
#set ($fwVehicleList = ["Ascent", "BRZ", "Crosstrek", "Forester", "Impreza", "Legacy", "Outback", "Solterra", "WRX"])
#foreach ($fwVehicle in $fwVehicleList)
#if ($VehicleModel.contains($fwVehicle))
#set ($fwHeaderVehicleModel = $fwVehicle)
#break
#else
#set ($fwHeaderVehicleModel = "Other")
#end
#end
Code copied!
Preheader ‌ ‌ ‌ ‌ ‌ ‌ ‌ ‌
Code copied!
<tr>
<td style="line-height:110%;padding-top:0;padding-bottom:0px;padding-right:0;padding-left:0;font-size:0px;" ><!--[if (gte mso 9)|(IE)]><img src="https://website.com/creative/Header_Animation.jpg" alt="$fwHeaderAltText" class="flex" style="border-width:0;display:block;-ms-interpolation-mode:bicubic;line-height:100%;width:100%;height:auto;" ><div style="display:none;" ><![endif]--><!--[if !mso]><!-- --><img src="Header_Animation.gif" alt="$fwHeaderAltText" class="flex" style="border-width:0;display:block;-ms-interpolation-mode:bicubic;line-height:100%;width:100%;height:auto;"><!--<![endif]--><!--[if (gte mso 9)|(IE)]></div><![endif]-->
</td>
</tr>
Code copied!
<style>
#LeftNavigation {position: relative}
#LeftNavigation::after {
position: absolute;
content: '1. Editable body copy\A 2. Editable dealer hours\A 3. Editable disclaimer';
font-size: 14px;
color: #ff0000 !important;
bottom: -155px;
right: 0;
background: black;
padding: 10px;
border: 1px solid #fff;
white-space: pre-wrap;
z-index: 100;
width: 215px;}
</style>
Code copied!
<table width="294" align="center" border="0" cellspacing="0" cellpadding="0">
<tr>
<td>
<div>
<!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="$DealershipUrl" style="height:45px;v-text-anchor:middle;width:294px;" strokecolor="#EB7035" fillcolor="#EB7035">
<w:anchorlock/>
<center style="color:#ffffff;font-family:Helvetica, Arial,sans-serif;font-size:16px;">I am a button →</center>
</v:roundrect>
<![endif]-->
<a href="$DealershipUrl" style="background-color:#EB7035;border:1px solid #EB7035;color:#ffffff;display:inline-block;font-size:16px;font-family:sans-serif;color:#ffffff;text-decoration:none;text-align:center;width:294px;-webkit-text-size-adjust:none;mso-hide:all;line-height: 45px; height: 45px;">I am a button →</a>
</div>
</td>
</tr>
</table>
<tr>
<td class="outer" style="padding-top:30px;padding-bottom:30px;padding-right:0;padding-left:0;text-align:center;line-height:110%;font-size:0px;" >
<table width="284" align="center" style="border-spacing:0;Margin:0 auto;font-family:Arial, Helvetica, sans-serif;" >
<tr>
<td class="outer" style="text-align:center;line-height:110%;padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;font-size:0px;" ><a href="$DealershipUrl?&utm_source=careconnect&utm_medium=email&utm_campaign=marketdriver-sales&ddcref=careconnect" target="_blank" data-surl-type="General" data-surl-meta1="cta_header" style="background-color:#55ab40;color:#ffffff;font-weight:bold;display:inline-block;font-size:15px;text-decoration:none;text-align:center;width:244px;-webkit-text-size-adjust:none;line-height:20px;height:20px;padding-top:20px;padding-bottom:20px;padding-right:0;padding-left:0;" ><!--[if mso]><img src="$image.GetUrl('SM201-Learn-More')" width="284" height="60" alt="LEARN MORE" data-noedit="1" style="border-width:0;display:block;-ms-interpolation-mode:bicubic;line-height:100%;" /><![endif]--><span style="mso-hide:all;" >LEARN MORE</span></a></td>
</tr>
</table>
</td>
</tr>
Code copied!
<!-- Amenities -->
#if ($amenities.Count != 0)
<tr>
<td style="background-color:#333333;line-height:110%;padding-top:30px;padding-bottom:30px;padding-right:0;padding-left:0;" >
<table width="100%" style="border-spacing:0;Margin:0 auto;font-family:Arial, Helvetica, sans-serif;" >
<tr>
<td class="row" style="line-height:110%;padding-top:0;padding-bottom:0px;padding-right:0;padding-left:0;font-size:0px;text-align:center;" >
<!--[if (gte mso 9)|(IE)]><table width="100%" style="border-spacing:0;Margin:0 auto;font-family:Arial, Helvetica, sans-serif;" ><tr><td width="50%" valign="top" style="line-height:110%;padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;" ><![endif]-->
<div class="fcol" style="max-width:324px;vertical-align:top;display:inline-block;width:100%;font-size:0px;" >
<table width="100%" style="border-spacing:0;Margin:0 auto;font-family:Arial, Helvetica, sans-serif;" >
<tr>
<td style="padding-top:0px;padding-bottom:0px;padding-right:20px;padding-left:20px;font-size:14px;color:#ffffff;text-align:left;line-height:130%;" >
<span style="font-weight:bold;color:#00b9e5;font-size:18px;">Our Service Amenities:</span><br>
#set ($fwCount = 0)
#foreach ($a in $amenities)
#set ($fwCount = $fwCount + 1)
#if ($fwCount % 2 == 0)
• $a.Name <br/>
#end
#end
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]></td><td width="50%" valign="top" style="line-height:110%;padding-top:0;padding-bottom:0;padding-right:0;padding-left:0;" ><![endif]-->
<div class="fcol" style="max-width:324px;vertical-align:top;display:inline-block;width:100%;font-size:0px;" >
<table width="100%" style="border-spacing:0;Margin:0 auto;font-family:Arial, Helvetica, sans-serif;" >
<tr>
<td style="padding-top:0px;padding-bottom:0px;padding-right:20px;padding-left:20px;font-size:14px;color:#ffffff;text-align:left;line-height:130%;" >
#set ($fwCount2 = 0)
#foreach ($a in $amenities)
#set ($fwCount2 = $fwCount2 + 1)
#if ($fwCount2 % 2 != 0)
• $a.Name <br/>
#end
#end
</td>
</tr>
</table>
</div>
<!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]-->
</td>
</tr>
</table>
</td>
</tr>
#end
Code copied!
<style type="text/css">
.video-wrapper {display:none;}
@media (-webkit-min-device-pixel-ratio: 0) and (min-device-width:1024px)
{
.video-wrapper { display:block!important; }
.video-fallback { display:none!important; }
}
@supports (-webkit-overflow-scrolling:touch) and (color:#ffffffff)
{
div[class^=video-wrapper] { display:block!important; }
div[class^=video-fallback] { display:none!important; }
}
#MessageViewBody .video-wrapper { display:block!important; }
#MessageViewBody .video-fallback { display:none!important; }
</style>
<tr>
<td style="padding:0; background-color:#ffffff; font-size:0;">
<!-- video section -->
<div class="video-wrapper" style="display:none;">
<video controls="controls" poster="https://website.com/creative/shot.jpg" style="width:100%; height: auto;"> <source src="http://website.com/creative/TomsMessage.mp4" type="video/mp4">
<!-- fallback 1 -->
<a target="_blank" data-surl-type="General" data-surl-meta1="Video" href="https://youtu.be/dQw4w9WgXcQ?si=YfHvw2CXxT2F_3U6" > <img alt="Play Video" src="https://website.com/creative/shot.jpg" style="border-width:0;display:block;-ms-interpolation-mode:bicubic;line-height:100%;width:100%;height:auto;" /> </a>
</video>
</div>
<!-- fallback section -->
<div class="video-fallback">
<a target="_blank" alt="Play Video" data-surl-type="General" data-surl-meta1="Video" href="https://youtu.be/dQw4w9WgXcQ?si=YfHvw2CXxT2F_3U6" > <img alt="Play Video" src="https://website.com/creative/shot.jpg" style="border-width:0;display:block;-ms-interpolation-mode:bicubic;line-height:100%;width:100%;height:auto;" /> </a>
</div>
</td>
</tr>
Code copied!
All code copied!