If you are a client who has onboarded on or after November 1, 2023, use these documents.
If you were onboarded prior to November 1, 2023, click here.
This feature can identify abandoned cart contents for known, non-logged in customers. If you use this feature, we will send all of those Add to Cart events to you.
To use this feature, you must first ensure that you’re using the most recent version of our script on your website. You can find your script in your account under Code Script > View Script. Click here for a link to all our tutorials on how to add the script to your site, in case you need a refresher.
If you're using our custom Shopify Integration app, the Add to Cart script will automatically be installed. For those not using this app, view the "On your website" section at the bottom.
Set up Added to Cart flow
Once you have installed our Add to Cart scripts manually or via our custom Shopify Integration app and events are passing, you will see the Added to Cart Reclaim metric show up in Klaviyo.
*These events are also passed along with Event Source= Reclaim IF you need an additional identifier for our events.
Additionally, you can see these events successfully passing through in your Retention.com account when you see the Added to Cart option populate under Event Details. This is an easy way to confirm that the Add to Cart script has been implemented successfully.
Step 1
Copy your existing Add to Cart abandonment flow in Klaviyo (not Abandoned checkout or Product/browse abandonment!) and name it Reclaim Add to Cart.
Edit the Flow Trigger to use the Added to Cart Reclaim metric. Your Client Success Manager can send a seed event to your Klaviyo account if necessary. If you're creating a new flow from scratch, use the Added to Cart Reclaim event as your trigger.
If you don't already have them, you should add flow filters to exclude anyone who has:
Placed Order zero times since starting this flow
ANDHas not been in flow in the last 7 days
ANDReceived Email zero times in the last 7 days where $flow equals (existing Added to Cart flow)
ANDPlaced Order zero times in the last 1 days
If flows are triggered off of Checkout Started and Checkout Started Reclaim, to add this flow filter:
Checkout Started zero times since starting this flow
AND
Checkout Started Reclaim zero times since starting this flow
Step 2
Extend the existing delay. For example, if your current Add to Cart delay is 15 minutes, set this delay for 30 minutes.
Step 3
Contact us at support[at]retention.com and request that we enable Add to Cart events for your account. If you're working with our implementation team, this will already be enabled.
Add SMS to your flow [Optional]
If you want to send an SMS to customers triggering the Added to Cart Reclaim metric, you can add an SMS step to the same flow created above.
Step 1
If your original Added to Cart flow also includes SMS, add the following flow filter:
Received SMS zero times in the last 7 days where $flow equals (existing added to cart/cart abandonment flow)
Step 2
In your existing Added to Cart Reclaim Flow, add a Conditional split after the first Time delay, to check whether or not there is consent to receive SMS. Drag your first Email Step over to the beginning of the No branch.
Step 3
Add an SMS Step at the start of the Yes branch. Reconnect both branches after the SMS Step, by dragging the Rejoin icon from the No branch to the Yes branch.
Step 4
Configure your SMS content. Short and sweet is best for SMS! Don't forget to set them live!
Dynamic Field List
These variables can be used in your email templates to dynamically populate information about your products.
For R! Added to Cart Reclaim events, the table with your product information should be set to Static.
The fields below are based on data sent from our Shopify Integration. Field names and variables may differ when using other eCommerce platforms or a custom setup.
Field Name | Example Value | Dynamic Variable Markup |
Currency | USD | {{ event.Currency|default:'' }} |
CurrencyPrice | $30 | {{ event.CurrencyPrice|default:'' }} |
Price | 30 | {{ event.Price|default:'' }} |
Formatted Price (displays $ only) | $30.00 | {% currency_format event.Price %} |
ImageURL | {{ event.ImageURL|default:'' }} | |
Name | Black V-Neck T-Shirt | {{ event.Name|default:'' }} |
ProductID | 3891613401160 | {{ event.ProductID|default:'' }} |
Quantity | 1 | {{ event.Quantity|default:'' }} |
URL | {{ event.URL|default:'' }} | |
item_category (when available) | V-Neck Tees | {{ event.item_category|default:'' }} |
variant | S | {{ event.variant|default:'' }} |
variant_id | 29276152856648 | {{ event.variant_id|default:'' }} |
On Your Website
If you aren't using our custom Shopify Integration app, you will need to add our Add to Cart script to your site builder:
geq.addToCart(item);
Next, edit the snippet.
Snippet 1: For buttons without redirects
You should update your script from this:
<script type="text/javascript">
var _learnq = _learnq || [];
function addedToCart() {
fetch(window.location.origin + '/cart.js')
.then(res => res.clone().json().then(data => {
var cart = {
total_price: data.total_price/100,
$value: data.total_price/100,
total_discount: data.total_discount,
original_total_price: data.original_total_price/100,
items: data.items
}
if (item !== 'undefined') {
cart = Object.assign(cart, item)
}
_learnq.push(['track', 'Added to Cart', cart])
}))
}
(function (ns, fetch) {
ns.fetch = function() {
const response = fetch.apply(this, arguments);
response.then(res => {
if ((window.location.origin + '/cart/add.js').includes(res.url)) {
addedToCart()
}
});
return response
}
}(window, window.fetch))
$(document).ajaxComplete(function(event, request, settings){
if((typeof settings != "undefined") && settings.url == "/cart/add.js"){
addedToCart()
}
})to this:
<script type="text/javascript">
var _learnq = _learnq || [];
function addedToCart() {
fetch(window.location.origin + '/cart.js')
.then(res => res.clone().json().then(data => {
var cart = {
total_price: data.total_price/100,
$value: data.total_price/100,
total_discount: data.total_discount,
original_total_price: data.original_total_price/100,
items: data.items
}
if (item !== 'undefined') {
cart = Object.assign(cart, item)
}
_learnq.push(['track', 'Added to Cart', cart])
geq.addToCart (item);
}))
}
(function (ns, fetch) {
ns.fetch = function() {
const response = fetch.apply(this, arguments);
response.then(res => {
if ((window.location.origin + '/cart/add.js').includes(res.url)) {
addedToCart()
}
});
return response
}
}(window, window.fetch))
$(document).ajaxComplete(function(event, request, settings){
if((typeof settings != "undefined") && settings.url == "/cart/add.js"){
addedToCart()
}
})
Snippet 2: For buttons with redirects defined by a button ID
You should update your script from this:
<script type="text/javascript">
var _learnq = _learnq || [];
document.getElementById("AddToCart").addEventListener('click',function (){
_learnq.push(['track', 'Added to Cart', item]);
});</script>to this:
<script type="text/javascript">
var _learnq = _learnq || [];
document.getElementById("AddToCart").addEventListener('click',function (){
_learnq.push(['track', 'Added to Cart', item]);
geq.addToCart(item);
});</script>
Snippet 3: For buttons with redirects defined by class notation
You should update your script from this:
<script type="text/javascript">
var _learnq = _learnq || [];
var classname = document.getElementsByClassName("add-to-cart");
var addToCart = function() {
_learnq.push(['track', 'Added to Cart', item]);
}; for (var i = 0; i < classname.length; i++) {
classname[i].addEventListener('click', addToCart, false);
}
</script>to this:
<script type="text/javascript">
var _learnq = _learnq || [];
var classname = document.getElementsByClassName("add-to-cart");
var addToCart = function() {
_learnq.push(['track', 'Added to Cart', item]);
geq.addToCart(item);
}; for (var i = 0; i < classname.length; i++) {
classname[i].addEventListener('click', addToCart, false);
}
</script>