Cart Items Reminder email template
An abandoned cart reminder for a vintage watch shop with small product photos, names and prices in a list, a small return code and one button.
Light shows the email as designed. Dark and Gmail show how email apps can change its colors.
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="x-apple-disable-message-reformatting">
<meta name="format-detection" content="telephone=no, date=no, address=no, email=no, url=no">
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
<title>Cart Items Reminder</title>
<!--[if gte mso 9]><xml><o:OfficeDocumentSettings><o:AllowPNG/><o:PixelsPerInch>96</o:PixelsPerInch></o:OfficeDocumentSettings></xml><![endif]-->
<style>
:root{color-scheme:light dark;supported-color-schemes:light dark;}
body{margin:0;padding:0;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;}
table,td{mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;}
img{border:0;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;}
a[x-apple-data-detectors]{color:inherit!important;text-decoration:none!important;font-size:inherit!important;font-family:inherit!important;font-weight:inherit!important;line-height:inherit!important;}
u + .ete-body a{color:inherit;text-decoration:none;}
@media only screen and (max-width:620px){
.ete-container{width:100%!important;max-width:100%!important;}
.ete-outer{padding:0!important;}
.ete-content{border-radius:0!important;}
.ete-px{padding-left:20px!important;padding-right:20px!important;}
.ete-stack{display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;box-sizing:border-box;padding-left:0!important;padding-right:0!important;}
.ete-stack-gap{padding-bottom:20px!important;}
.ete-fluid{width:100%!important;max-width:100%!important;height:auto!important;}
.ete-fluid-cap{width:100%!important;max-width:280px!important;height:auto!important;display:block!important;margin-left:auto!important;margin-right:auto!important;}
.ete-stack-center,.ete-stack-center p{text-align:center!important;}
.ete-h1{font-size:28px!important;line-height:34px!important;}
.ete-h2{font-size:22px!important;line-height:28px!important;}
.ete-code{font-size:24px!important;letter-spacing:2px!important;}
.ete-btn-full{display:block!important;width:100%!important;box-sizing:border-box;}
.ete-ds-26{font-size:28px!important;line-height:31px!important;}
.ete-cell{padding-left:0!important;padding-right:0!important;}
}
@media (prefers-color-scheme: dark){
.ete-body,.ete-bg{background-color:#0f1111!important;}
.ete-content{background-color:#181a1a!important;}
.ete-text{color:#c4c8c7!important;}
.ete-heading{color:#ffffff!important;}
.ete-muted{color:#9aa09f!important;}
.ete-link{color:#62d6c8!important;}
.ete-border{border-color:#2c302f!important;}
.ete-panel{background-color:#1f2423!important;border-color:#2c302f!important;}
.ete-btn{background-color:#35c3b2!important;border-color:#35c3b2!important;}
.ete-btn-text{color:#08201d!important;}
.ete-btn-outline{border-color:#35c3b2!important;}
.ete-btn-outline-text{color:#35c3b2!important;}
.ete-logo-light{display:none!important;}
.ete-logo-dark{display:block!important;max-height:none!important;overflow:visible!important;}
}
[data-ogsc] .ete-text{color:#c4c8c7!important;}
[data-ogsc] .ete-heading{color:#ffffff!important;}
[data-ogsc] .ete-muted{color:#9aa09f!important;}
[data-ogsc] .ete-link{color:#62d6c8!important;}
[data-ogsb] .ete-body,[data-ogsb] .ete-bg{background-color:#0f1111!important;}
[data-ogsb] .ete-content{background-color:#181a1a!important;}
[data-ogsb] .ete-panel{background-color:#1f2423!important;border-color:#2c302f!important;}
</style>
</head>
<body class="ete-body" style="margin:0;padding:0;width:100%;background-color:#f0f0ee;">
<!-- Made with emailtemplateexamples.com -->
<div class="ete-preheader" style="display:none;font-size:1px;line-height:1px;max-height:0;max-width:0;opacity:0;overflow:hidden;mso-hide:all;">Two watches are still in your cart. We hold them until Sunday. ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ </div>
<table role="presentation" class="ete-bg" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#f0f0ee;">
<tr><td align="center" class="ete-outer" style="padding:24px 12px;">
<!--[if mso]><table role="presentation" width="600" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td><![endif]-->
<table role="presentation" class="ete-container" width="600" cellpadding="0" cellspacing="0" border="0" style="width:100%;max-width:600px;margin:0 auto;">
<tr><td class="ete-content" style="background-color:#ffffff;">
<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%;">
<tr><td align="left" class="ete-px" style="padding:28px 32px 20px;"><a href="https://example.com/" style="text-decoration:none;color:#141414;"><span class="ete-heading" style="font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:18px;line-height:23px;font-weight:700;letter-spacing:2px;color:#141414;">HOLLIS</span></a></td></tr>
<tr><td class="ete-px" style="padding:24px 32px 8px;"><h1 class="ete-heading ete-ds-26" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:26px;line-height:31px;font-weight:700;color:#141414;text-align:left;mso-line-height-rule:exactly;">Your cart is still waiting</h1></td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:24px;color:#808080;text-align:left;">Two pieces are still in your cart. Each one is a single watch, so we hold them for you until Sunday.</p></td></tr>
<tr><td class="ete-px" style="padding:16px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-top:16px;"><tr><td class="ete-border" width="76" valign="top" style="padding:14px 12px 14px 0;border-bottom:1px solid #e7e7e7;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/cart-items-reminder-w1.jpg" alt="Silver pocket watch with an open white dial" width="64" height="64" class="" style="display:block;width:64px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;border-radius:4px;"></td><td class="ete-text ete-border" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e7e7;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;color:#565656;"><strong>Silver pocket watch, 1890s</strong><br><span class="ete-muted" style="color:#808080;font-size:13px;">Key wound, serviced</span></td><td class="ete-text ete-border" align="right" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e7e7;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;color:#565656;;white-space:nowrap;">$420</td></tr><tr><td class="ete-border" width="76" valign="top" style="padding:14px 12px 14px 0;border-bottom:1px solid #e7e7e7;"><img src="https://emailtemplateexamples.com/wp-content/plugins/ete-core/assets/template-images/cart-items-reminder-w2.jpg" alt="Silver pocket watch with a round case on grey" width="64" height="64" class="" style="display:block;width:64px;max-width:100%;height:auto;border:0;outline:none;text-decoration:none;border-radius:4px;"></td><td class="ete-text ete-border" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e7e7;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;color:#565656;"><strong>Pair case pocket watch</strong><br><span class="ete-muted" style="color:#808080;font-size:13px;">Hand engraved dial</span></td><td class="ete-text ete-border" align="right" valign="top" style="padding:14px 0;border-bottom:1px solid #e7e7e7;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;color:#565656;;white-space:nowrap;">$560</td></tr></table><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-top:8px;"><tr><td class="ete-muted" style="padding:4px 0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;color:#808080;">Shipping</td><td class="ete-text" align="right" style="padding:4px 0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:15px;line-height:22px;color:#565656;">Free, insured</td></tr><tr><td class="ete-heading" style="padding:12px 0 0;border-top:2px solid #141414;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:17px;line-height:24px;font-weight:700;color:#141414;">Total</td><td class="ete-heading" align="right" style="padding:12px 0 0;border-top:2px solid #141414;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:17px;line-height:24px;font-weight:700;color:#141414;">$980</td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:16px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td align="center" class="ete-panel" style="padding:24px 20px;background-color:#f6faf9;border:2px dashed #0a7f74;border-radius:0px;text-align:center;"><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:16px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#808080;">Ten percent off if you finish today</p><p class="ete-code ete-heading" style="margin:0;padding-top:8px;font-family:'Courier New',Courier,monospace;font-size:30px;line-height:38px;font-weight:700;letter-spacing:4px;color:#141414;">BACK10</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:19px;color:#808080;padding-top:6px;">Valid until Sunday at midnight.</p></td></tr></table></td></tr>
<tr><td align="left" class="ete-px" style="padding:16px 32px;"><table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr><td align="center"><!--[if mso]><v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://example.com/cart" style="height:48px;v-text-anchor:middle;width:262px;" arcsize="50%" strokecolor="#0a7f74" fillcolor="#0a7f74"><w:anchorlock/><center style="color:#ffffff;font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">Continue to your order</center></v:roundrect><![endif]--><!--[if !mso]><!--><a class="ete-btn" href="https://example.com/cart" style="display:inline-block;background-color:#0a7f74;border:1px solid #0a7f74;line-height:48px;border-radius:24px;color:#ffffff;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:700;text-align:center;text-decoration:none;padding:0 28px;-webkit-text-size-adjust:none;mso-hide:all;"><span class="ete-btn-text" style="color:#ffffff;">Continue to your order</span></a><!--<![endif]--></td></tr></table></td></tr>
<tr><td height="16" style="height:16px;font-size:0;line-height:0;mso-line-height-rule:exactly;"> </td></tr>
<tr><td class="ete-px" style="padding:8px 32px;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-border" style="border-top:1px solid #e7e7e7;font-size:0;line-height:0;"> </td></tr></table></td></tr>
<tr><td class="ete-px" style="padding:16px 20px 0;"><div style="font-size:0;text-align:left;"><!--[if mso]><table role="presentation" width="560" cellpadding="0" cellspacing="0" border="0"><tr><td width="186" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:33.33%;max-width:100%;width:33.33%;width:calc((448px - 100%) * 448);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:12px 12px 8px;"><p class="ete-heading" style="margin:0 0 8px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#141414;">About</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#808080;line-height:20px;">Hollis restores and sells antique pocket and wrist watches, one at a time.</p></td></tr></table></div><!--[if mso]></td><td width="186" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:33.33%;max-width:100%;width:33.33%;width:calc((448px - 100%) * 448);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:12px 12px 8px;"><p class="ete-heading" style="margin:0 0 8px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#141414;">Contact</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#808080;line-height:20px;">9 Clock Row<br>
Bath BA1 1LT<br>
shop@example.com</p></td></tr></table></div><!--[if mso]></td><td width="186" valign="top"><![endif]--><div class="ete-stack" style="display:inline-block;vertical-align:top;min-width:33.33%;max-width:100%;width:33.33%;width:calc((448px - 100%) * 448);font-size:16px;text-align:left;"><table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0"><tr><td class="ete-cell" style="padding:12px 12px 8px;"><p class="ete-heading" style="margin:0 0 8px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:18px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#141414;">Useful links</p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/shop" style="color:#808080;text-decoration:underline;">Shop</a></p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/account" style="color:#808080;text-decoration:underline;">Account</a></p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/wishlist" style="color:#808080;text-decoration:underline;">Wishlist</a></p><p style="margin:0;padding-top:4px;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:20px;"><a class="ete-link" href="https://example.com/orders" style="color:#808080;text-decoration:underline;">Orders</a></p></td></tr></table></div><!--[if mso]></td></tr></table><![endif]--></div></td></tr>
<tr><td align="center" class="ete-px" style="padding:28px 32px 32px;"><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#808080;line-height:20px;text-align:center;padding-top:10px;">You get this email because you left items in your cart at Hollis.</p><p class="ete-muted" style="margin:0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:13px;line-height:21px;color:#808080;line-height:20px;text-align:center;padding-top:10px;"><a class="ete-link" href="{{unsubscribe_url}}" style="color:#808080;text-decoration:underline;">Unsubscribe</a></p></td></tr>
</table>
</td></tr>
<tr><td align="center" class="ete-muted" style="padding:20px 12px 0;font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;line-height:18px;color:#808080;">Made with <a class="ete-link" href="https://emailtemplateexamples.com/" style="color:#808080;text-decoration:underline;">Email Template Examples</a></td></tr>
</table>
<!--[if mso]></td></tr></table><![endif]-->
</td></tr>
</table>
</body>
</html>
Adapted from Colorlib Email Templates (template 12, shopping cart) by Colorlib, MIT license.
About this template
A reminder for shoppers who put something in the cart and left. This version is set up for a small vintage watch dealer, but the layout fits any shop that sells a few considered items rather than a big basket.
A short wordmark sits at the top left. The headline says plainly that the cart is still waiting, and one line explains how long the pieces are held. Each item follows in a clean list with a square photo, the name, a short detail line and the price on the right, divided by thin lines.
A small code panel offers ten percent off for coming back, and one rounded button takes the reader straight to checkout. The email closes with a three column footer for the shop story, the address and the main links, then the unsubscribe line.
The structure follows a designer cart reminder template. Keep the list to two or three items, use the same photo style for each, and only add the code if you really want to nudge.
Use it in your email tool
- Click Copy HTML, or download the .html file.
- In Mailchimp, Brevo, HubSpot or Klaviyo, start a new email with the custom HTML or code editor and paste it in.
- Change the text, links and images. Map merge tags such as {{first_name}} and {{unsubscribe_url}} to the tags of your tool.
- Send a test to yourself on desktop and phone before you send it to your list.
Sections in this email
- Wordmark
- Headline and hold note
- Cart items with photos and prices
- Return code
- Checkout button
- Three column footer
Subject line ideas
- Your cart is still waiting
- We are holding two watches for you
- {{first_name}}, ten percent off if you finish today
Preview text idea
Two watches are still in your cart. We hold them until Sunday.