Last active
September 15, 2015 15:49
-
-
Save jacopo-nosto/4fcd003eb51329a7a716 to your computer and use it in GitHub Desktop.
Email AC template - NOSTO
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| ## 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+"&utm_medium="+$mailsetting.utm_medium+"&utm_campaign="+$mailsetting.utm_campaign+"&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> </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