Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Email AC template - NOSTO
## EMAIL LINK SETTINGS
#set( $mailsetting = {
"account" : $account,
"storeUrl" : $storeUrl,
"utm_source" : "nosto",
"utm_medium" : "email",
"utm_campaign" : "AbandonedCart",
"showInBrowserText" : $ASETUKSET.naytaSelaimessaTeksti,
"unsubscribeLinkText" : $unsubscribeLinkText
})
## END EMAIL SETTINGS
## -------------------------
## CUSTOMIZATION SETTINGS
#set( $custom = {
"emailTitle" : "My Store - Abandoned Cart email",
"mainFont" : "Helvetica, Arial, sans-serif",
"productheadingSize" : "17px",
"productheadingColor" : "#333333",
"productbrandSize" : "13px",
"productbrandColor" : "#333333",
"productnameSize" : "13px",
"productnameColor" : "#333333",
"bodyBackgroundColor" : "#EEEEEE",
"mailBackgroundColor" : "#FFFFFF",
"logoContainerBackground" : "#000000",
"logoLink" : "https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/nosto_logo.png",
"headerLink" : "https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/headernosto.jpg"
})
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
<title>$custom.emailTitle</title>
</head>
<body marginheight="0" topmargin="0" marginwidth="0" style="margin: 0px; background-color: $custom.bodyBackgroundColor;" bgcolor="$custom.bodyBackgroundColor" leftmargin="0">
<table cellspacing="0" border="0" cellpadding="0" width="700" bgcolor="$custom.mailBackgroundColor" style="margin-right: auto; margin-left: auto;">
<tbody>
<tr>
<td>
<table cellspacing="0" border="0" align="center" cellpadding="0" width="700">
<tbody>
<tr>
<td>
<table cellspacing="0" border="0" cellpadding="0" width="700">
<tbody>
<tr>
<td valign="top">
<table cellspacing="0" border="0" cellpadding="0" width="700">
<tbody>
<tr style="width: 100%; height: 150px; background: $custom.logoContainerBackground;">
<td>
<h1 style="color: #333; margin: 0px; font-weight: normal; font-size: 60px; font-family: $custom.mainFont;"> <a href="$!storeUrl"><img alt="Logo" style="margin: 0 auto; position: relative; display: block; height: 80px;" src="$custom.logoLink"></a></h1>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<table cellspacing="0" border="0" cellpadding="0" width="700">
<tbody>
<tr>
<td height="0" valign="middle" width="700"></td>
</tr>
</tbody>
</table>
<table cellspacing="0" border="0" id="email-content" cellpadding="0" width="700">
<tbody>
<tr>
<td>
<table cellspacing="0" border="0" cellpadding="0" width="700">
<tbody>
<tr>
<td>
<p style="font-size: 17px; line-height: 24px; font-family: $custom.mainFont; color: #333; margin: 0px;"><img alt="Header" width="700" src="$custom.headerLink"></p>
<p style="font-size: 17px; line-height: 50px; font-family: $custom.mainFont; font-weight: 700; color: #333; margin: 0px; padding:25px 15px 45px 15px;">Hi#if(${visit.info.first_name}) $!{visit.info.first_name},#end</p>
<p style="font-size: 17px; line-height: 30px; font-family: $custom.mainFont; color: #333; margin: 0px; padding:0 15px;">We noticed that you added items to your shopping cart, but didn't end up buying them. Here is your shopping cart contents and some recommendations for you.<br><br>At the bottom you can also take a look at other products popular with our customers right now.</p>
</td>
</tr>
<tr>
<td style="padding-top: 40px; padding-bottom: 20px; text-align: center;">
<a href="#" style="text-decoration: none; font-family: Geneva, Tahoma, Verdana, sans-serif; color: #ffffff; background: #000000; font-size: 17px; padding: 10px; display: inline-block;">Go shopping!</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
<tbody></tbody>
</table>
#macro(recommendation $products $settings)
#if($products.size() > 0)
<table cellspacing="0" border="0" cellpadding="0" width="700">
<tbody>
<tr>
<td>
<p style="padding-top: 25px; font-size: $custom.productheadingSize; text-align: center; font-family: $custom.mainFont; color: $custom.productheadingColor; margin: 10px 0px; text-transform: uppercase;"><b>$settings.heading</b></p>
<table cellspacing="0" border="0" cellpadding="8" width="95%" style="margin: 10px 0 20px 0; padding: 15px 0; border-top: 1px solid #848484; border-bottom: 1px solid #848484;margin-right: auto; margin-left: auto;">
<tbody>
<tr>
#set($productcount = 0)
#foreach($product in $products)
#if($productcount < $settings.maxAmount)
#set($linkUrl=$product.url+"&utm_source="+$mailsetting.utm_source+"&amp;utm_medium="+$mailsetting.utm_medium+"&amp;utm_campaign="+$mailsetting.utm_campaign+"&amp;utm_content=cartProduct")
<td valign="top" style="text-align: center">
<a href="$!linkUrl" style="text-decoration: none;">
<p style="font-size: 17px; line-height: 24px; font-family: $custom.mainFont; color: #333; margin: 0px;"></p>
<img src="$!product.thumb(7)">
<p></p>
<h4 style="font-size: $custom.productbrandSize; font-weight: 700; font-family: $custom.mainFont; color: $custom.productbrandColor !important; margin: 12px 0px; text-align: center;">$product.brand.truncate(45)</h4>
<p style="font-size: $custom.productnameSize; font-weight: 300; font-family: $custom.mainFont; color: $custom.productnameColor !important; margin: 12px 0px; text-align: center;">$product.name.truncate(45)</p>
</a>
</td>
#set($productcount = $productcount + 1)
#if($productcount % 3 == 0)
</tr>
<tr>
#end
#end
#end
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
#end
#end
#set( $settings = {
"heading" : "Your cart",
"maxAmount" : 3
})
#recommendation($CartProducts $settings)
#set( $settingstwo = {
"heading" : "Items You Were Interested In",
"maxAmount" : 6
})
#recommendation($UserLastViewedRelatedProducts $settingstwo)
<!--section 1-->
<table cellspacing="0" border="0" cellpadding="0" width="700">
<tbody>
<tr>
<td>
<p>
</p>
<p style="font-size: 17px; line-height: 24px; font-family: $custom.mainFont; color: #333; margin: 0px;text-align:center;"> <strong>HURRY UP! Your articles may be gone soon.</strong></p>
<p style="font-size: 17px; line-height: 24px; font-family: $custom.mainFont; color: #333; margin: 0px;text-align:center;">Check out your cart at <a href="$!storeUrl">mystore.com</a> to receive them as soon as possible.</p>
<p style="font-size: 17px; line-height: 24px; font-family: $custom.mainFont; color: #333; margin: 0px; height: 40px;">
</p>
</td>
</tr>
</tbody>
</table>
<table style="margin: 0 auto" cellspacing="0" cellpadding="0" border="0" width="100%" height="20" bgcolor="black">
<tr></tr>
<tr>
<td style="padding-top: 20px; text-align:center; font-size:15px; color: #eeeeee; font-family: $custom.mainFont;">Follow us on:<br/><br/></td>
</tr>
</table>
<table style="margin: 0 auto" cellspacing="0" cellpadding="0" border="0" width="100%" bgcolor="black" style="text-align:center;">
<tr style=" width: 336px !important; display: block; margin: 0 auto;">
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/facebook.png" alt="facebook icon"/></a>
</td>
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/gplus.png" alt="twitter icon"/></a>
</td>
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/Instagram.png" alt="google+ icon"/></a>
</td>
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/linkedin.png" alt="google+ icon"/></a>
</td>
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/pinterest.png" alt="facebook icon"/></a>
</td>
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/twitter.png" alt="twitter icon"/></a>
</td>
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/wordpress.png" alt="google+ icon"/></a>
</td>
<td style="width: 42px;">
<a href="#" target="_blank"><img src="https://nosto-campaign-assets.s3.amazonaws.com/nosto-wmy-jacopo/social/youtube.png" alt="google+ icon"/></a>
</td>
</tr>
<tr colspan="5">
<td>
<p> </p>
</td>
</tr>
<tr>
</table>
<table style="margin: 0 auto" cellspacing="0" cellpadding="0" border="0" width="100%" height="20" bgcolor="black">
<tr>
<td style="padding-top: 20px; text-align:center; font-size:12px; color: #eeeeee; font-family: $custom.mainFont;">Click <a href="$!unsubscribeUrl" style="color: #ffffff;">here</a> if you don't want to receive these emails anymore.<br></td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
</td>
##end content
</tr>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment