By configuring Retention's Reclaim flows, users gain the ability to accurately track and recognize critical customer actions, specifically 'add to cart' and 'viewed product' events. This setup ensures that Retention efficiently relays all such 'Add to Cart' and 'Viewed Product' events directly to your Yotpo SMS & EMAIL.
For more information on Yotpo SMS & EMAIL Abandoned Checkout Reminders, click here.
To use this feature, you must have the most recent version of our script on your website and the Yotpo SMS & EMAIL integration. 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.
NOTE: This integration is currently only for Shopify users.
Set up integration
1. To setup an integration between Retention.com and Yotpo SMS & EMAIL, go to Integrations > Available Integrations. Then, search for Yotpo and click the icon.
2. Click Connect.
3. This will open a window to give Retention.com access to Yotpo. If you're not logged into your Yotpo account via Shopify, you will need to login first.
4. Once you're logged in, you'll be taken to this screen to give Retention.com access. Click Next.
5. Then, click Connect to authorize the integration.
6. Once the integration is complete, you will see the integration date. Click to Enable the integration. You can also Remove the integration from this page at the top.
Install Add to Cart and Viewed Product scripts
Note: If you're using our custom Shopify Integration app, the 'Add to Cart' and 'Viewed Product' scripts will automatically be installed.
Prerequisite:
The 'Add to Cart' and 'Viewed Product' scripts require you to set up an item variable. This variable will be placed before these scripts in your sites code builder.
The following fields are recommended:
Name of Product
Price
ProductID
Categories (if applicable)
ImageURL
Brand (if applicable)
Please note the variable should be an object and the values should be dynamic - not hardcoded. You may add or remove variables as you please.
For an example of what the object should look like, please reference the example below:
<script type="text/javascript">
var item = {
Name: ##{{ product.title|json }},
ProductID: ##{{ product.id|json }},
ImageURL: "##{{ product.featured_image.src }}",
URL: "##{{ shop.secure_url }}##{{ product.url }}",
Brand: ##{{ product.vendor|json }},
Price: ##{{ product.price|money|json }},
CompareAtPrice: ##{{ product.compare_at_price_max|money|json }}
};
</script>
Instructions
1. Script Placement:
Begin by accessing your site builder. Once there, you'll need to decide the most suitable location for the script.
Typically, the most effective placement is on your product pages. Product pages inherently include both the 'Add to Cart' button and the product details. Adding the script here ensures that the tracking of the Reclaim events are seamlessly integrated with the relevant product information.
2. Adding the scripts:
After identifying the appropriate location for the code within your site, proceed to insert the 'item' object from above and modify it with the corresponding dynamic values.
Instructions for 'Add to Cart'
Instructions for 'Add to Cart'
To track the 'Add to Cart' event, which activates upon a button click, you need to attach an event listener to the 'Add to Cart' button.
Below, two sample codes are provided: one for targeting a button by its ID, and another for a button class.
Choose the appropriate code for your button type and customize it to target your specific 'Add to Cart' button.
Generic code for buttons defined by a button ID:
<script type="text/javascript"> document.getElementById("AddToCart").addEventListener('click',function (){ geq.addToCart(item) });</script>Generic code for button defined by a class notation:
<script type="text/javascript">
var item_classnames = document.getElementsByClassName("AddToCart");
for (var i = 0; i < item_classnames.length; i++) {
item_classnames[i].addEventListener('click', function () {
geq.addToCart(item);
});
}
</script>
The function that actually calls our event is : geq.addToCart(item);
Instructions for 'Viewed Product'
Instructions for 'Viewed Product'
This script is meant to run as soon as a user lands on a product page. To invoke it, simply add the following code to your site (after the item variable):
geq.event('Viewed Product Reclaim', item);
Example Implementation
Below is an example of what your code would look like if both Reclaim scripts were implemented:
<script type="text/javascript">
var item = {
Name: ##{{ product.title|json }},
ProductID: ##{{ product.id|json }},
ImageURL: "##{{ product.featured_image.src }}",
URL: "##{{ shop.secure_url }}##{{ product.url }}",
Brand: ##{{ product.vendor|json }},
Price: ##{{ product.price|money|json }},
CompareAtPrice: ##{{ product.compare_at_price_max|money|json }}
};
// Viewed Product Script
geq.event('Viewed Product Reclaim', item);
// Add to Cart Script
var item_classnames = document.getElementsByClassName("AddToCart");
for (var i = 0; i < item_classnames.length; i++) {
item_classnames[i].addEventListener('click', function () {
geq.addToCart(item);
});
}
</script>
How to set up flows
Retention is excited to introduce Reclaim events, now available for both SMS and EMAIL flows within Yotpo. For optimal integration, please adhere to the corresponding flow guide provided below.
Click here to implement the SMS Flow in Yotpo
Click here to implement the SMS Flow in Yotpo
1. Go to Flows > Create flow from scratch.
2. For your Add to Cart flow, click Add to Cart Reclaim under Retention.com to set it as the Trigger.
For the Viewed Product flow, click Viewed Product Reclaim under Retention.com to set it as the Trigger.
3. Next, Add step > Add delay.
4. Set a 30-minute delay.
5. Add a Condition step to check if:
Is an SMS subscriber > is true
If No, End Flow.
6. If Yes, check if:
Made an order after flow started > is false
7. If No, End Flow. For Yes, set the condition to:
Country and address > Any country and address match > Country > is > United States
8. If No, End Flow. If yes, add a step.
9. Choose action for SMS/MMS message.
10. Edit the existing text message to include our shortcodes, like in this example for the Add to Cart flow.
We send these six shortcodes with our events:
{price}
{image Url}
{product Id}
{name}
{brand}
{url}
And here's an example of how that would look in a Viewed Product flow:
11. When you're finished, add End flow.
Note: Smart Sending should be enabled by default in Yotpo SMS & EMAIL. However, if you want to exclude transactional messages, you will need to manually do this by going to Settings > General Settings > Smart sending.
Click here to implement the EMAIL Flow in Yotpo
Click here to implement the EMAIL Flow in Yotpo
1. Go to Flows > Create flow from scratch.
2. For your Add to Cart flow, click Add to Cart Reclaim under Retention.com to set it as the Trigger.
For the Viewed Product flow, click Viewed Product Reclaim under Retention.com to set it as the Trigger.
3. Next, Add step > Add delay.
4. Set a 30-minute delay.
5. Add a Condition step to check if:
Is an Email subscriber > is true
If No, End Flow.
6. If Yes, check if:
Made an order after flow started > is false
7. If No, End Flow. For Yes, set the condition to:
Country and address > Any country and address match > Country > is > United States
8. If No, End Flow. If yes, add an Action step for Email Message.
9. Add an email subject and then click on Edit design.
10. From the Blocks section, drag and drop the Dynamic Products block to the template. This will be populated with the abandoned checkout/browse products for each customer.
11. Ensure you set the Max products to show setting to 1. Design the rest of the email template to fit your brand. Go back to the flow when completed.
12. When you're finished with your flow, click Save in the top right hand of the screen.
Where to access 'Add to Cart' and 'Viewed Product' events
You can view these events successfully passing through in your Retention.com account. In the Retention dashboard, go to Event Details and from the filter select "Added to cart" or "Viewed Product Reclaim".
Have questions? Message us on chat, or email us at support[at]retention.com!