Browse Abandonment Email Template

The trigger is precise. A shopper viewed a product detail page, never fired an add-to-cart event, and never placed an order inside the window you set. Fire this email once per product with a cooldown, not on every pageview, or you end up spamming people mid-session. In Klaviyo that maps to a Viewed Product trigger, filtered by Has not started checkout and Placed Order zero times over the last 30 days.

Timing is where most browse flows lose money, because intent decays fast after a view. For apparel and home brands we see the sweet spot land between 3 and 6 hours after the last viewed product, with a second send at 24 hours for anyone who did not click. Wait 48 hours and the shopper has moved on, or bought somewhere else. On a well-tuned flow, most browse-to-purchase revenue lands inside that first 12-hour window.

The message is one product, one reason to come back, and no pressure. This template does not push a discount on the first touch. The shopper has not shown cart intent yet, so handing them 15 percent off trains them to browse and wait for the coupon. Lead with the item and social proof instead. A subject like "Still thinking about the Oversized Linen Shirt?" with a preheader of "4.8 stars from 1,240 reviews, back in your size" beats "Here is 10 percent off" almost every time we test it.

The body backs the subject. A clay eyebrow reads "Still thinking about it," a serif headline reads "Take another look," and one line of copy acknowledges they looked and drops the pressure: "We held onto it for you. No cart to fill out, no countdown." Then a review block carries the proof, five stars, the count, and a scarcity line like "Only 7 left in Medium." That single scarcity cue does most of the lifting.

CTA discipline is the last piece. One button, one destination, straight back to the product page. Not a category grid, not a carousel of other things they viewed, and not a generic "Continue shopping" link. This template sends the shopper to the exact PDP with a "Shop the shirt" button, plus one soft text link to the saved items page. Across the DTC apparel accounts we watch, a browse flow set up this way tends to land in the 3 to 6 percent click-through range and convert roughly 1 to 2 percent of recipients. Your numbers move with average order value, margin, and how clean your view tracking is.

Email clients are not browsers. Outlook on Windows desktop renders HTML through Word's engine, Gmail strips large parts of your stylesheet, and Apple Mail can invert your colors in dark mode. This template is built for those rules, not against them.

The entire layout is nested HTML tables. There are no divs, no flexbox, no CSS grid. MJML compiles every section into stacked tables with inline cell styles, which is the one structure Outlook's Word engine and Gmail both parse without breaking. The content sits inside a 600px container, the width that still holds up across desktop and mobile clients.

Every style that matters is inline on the element. The headline color, the button background, and the price size all live as style attributes on the td and a tags. Gmail drops style blocks for non-Gmail (Gmail IMAP) accounts, so anything that lives only in a style tag can vanish there. Inlining puts it out of reach of that stripping.

The button is a real button in Outlook, not a gray box. The "Shop the shirt" call to action uses a bulletproof VML button, a v:roundrect with an anchor lock and a solid clay fill for Outlook's Word engine, and a styled anchor with the same fill and label for every other client. Outlook gets the same filled, rounded shape Gmail does.

The copy is live HTML text, not text baked into an image. The headline, the price, the review count, and the scarcity line all render as real text, so they load instantly, scale on a phone, and stay legible if images are blocked, which many inboxes do by default. The product photo is the only image, and it carries real alt text describing the shirt, so the email still reads with images off.

Dark mode is handled with a color-scheme meta in the head declaring light only, plus the supported-color-schemes tag and the Apple reformatting guard. That tells Apple Mail and others not to auto-invert the palette into something muddy. There is exactly one mobile media query, the only one in the file: at 480px it tightens the side padding and scales the serif headline down so the subject fits a phone screen. Web fonts load through a Fraunces import with a Georgia and Times fallback, so Outlook, which ignores web fonts entirely, falls back to a serif that still looks editorial.

The workflow is copy, paste, swap, test, send. You do not rebuild anything.

First, copy the full HTML from the export. In Klaviyo, open your browse abandonment flow email, switch the message to the HTML editor (or drag an HTML block into a drag-and-drop email and paste the markup into it). In Mailchimp, start a campaign, choose "Code your own," then "Paste in code," and drop the HTML in. Both editors accept table-based HTML without rewriting it.

Second, rebrand it. Replace HARTWELL with your store name in the header and footer. Swap the product image source, and point the image and button at the real product page. Update the product name, price, and spec line. The palette is two brand colors plus neutrals: the clay accent #B5533C for the eyebrow, stars, scarcity line, and button, and the ink #1E2228 for headlines, body text, and the footer band, on a warm paper ground #F4EFE7. Find and replace those three hex values and the whole email re-skins. Edit the subject line and preheader at the top of the file, and point every example.com URL at your real product page, unsubscribe, and preferences links.

Third, wire in your ESP's dynamic tags so the email pulls the actual viewed item. In Klaviyo, a Viewed Product trigger exposes the viewed item's name, price, image, and URL as event variables, so you map {{ event.Name }}, {{ event.Price }}, and {{ event.URL }} onto the matching text and link, and bind the product image to the event's image property. Add a flow filter for Placed Order zero times since the view, so you never email a buyer. In Mailchimp, connect your store and drop a product content block in for the image, name, price, and link, or map your list's product merge tags onto those fields.

Last, test before you turn the flow on. Send a preview to yourself and open it in Gmail on web and Android, Apple Mail on iOS in both light and dark, and Outlook on Windows desktop. Click the button to confirm it lands on the product page, check that the image loads and the links resolve, and verify the button shows as a filled clay shape in Outlook. Then set the trigger to fire 4 hours after the last viewed product, with a 24-hour second send, and a once-per-product cooldown so nobody gets two browse emails for the same shirt.