Adding a rating aggregate to your abandoned cart emails will dynamically pull in product star ratings.
Once you have completed the following instructions, you’ll see your product star ratings appear under the product title in your abandoned cart emails. Please note that this will only work in Klaviyo flows and not campaigns.
Enable your Klaviyo Feed
Open your Okendo app
Click Settings > Integrations
Click the pencil icon next to Klaviyo
Turn on the Enable Product Review Aggregate Feed toggle
Click Save
⚠️ Note: Once enabled, allow up to 24 hours for your feed to be populated before continuing.
Add the Product Review Aggregate Feed
Navigate to your Klaviyo account > Settings > Web Feeds > Add Web Feed.
Input the following data into the spaces and click update.
Required name: product_review_aggregate
Request Method: GET
Content-Type: JSON
⚠️ Note: In Klaviyo’s New Editor, web feeds are automatically enabled so you don’t need to further action.
Adding Star Rating Under Product Title
Select the product block, where the products from the cart will populate. The example below is within the Shopify Abandoned Cart Reminder Flow.
On your left panel, select "Rows" > "Data Source" and confirm that you are using the correct “Row Collection” and “Row Alias”.
Row Collection: event.extra.line_items
Row Alias: item
On that same left panel, select Column 2 > Source then paste the below snippet of code under an existing Quantity <p> tag.
{% with product=item.product %} {% with productId=item.product.id|slugify %}</p>
</div>
{% for value in feeds.product_review_aggregate %}{% if productId == value.product_id %}
<table style="border: 0;" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td style="padding-top: 2px; padding-right: 2px;"><img style="height: 14px;" src="https://d3hw6dc1ow8pp2.cloudfront.net/emails/review/stars/stars-{% widthratio value.rating 1 10 %}-000000.png" height="14" /></td>
<td>
<p style="padding-top: 1px; padding-left: 2px; font-size: 14px;">{{ value.count }} {% if value.count > 1 %} Reviews {% endif %}{% if value.count == 1 %} Review {% endif %}</p>
</td>
</tr>
</tbody>
</table>
{% endif %}{% endfor %}
<div>{% endwith %} {% endwith %}</div>
⚠️ Note: If you aren’t using the standard Data Source (item.product.title) you’ll need to use the below custom event snippet of code.
{% with productId=event.ProductID|slugify %} {% for value in feeds.product_review_aggregate %} {% if productId == value.product_id %}
<table cellpadding="0" cellspacing="0" style="border:0;">
<tbody>
<tr>
<td style="padding-top:2px;padding-right:2px"><img height="14" src="https://d3hw6dc1ow8pp2.cloudfront.net/emails/review/stars/stars-{% widthratio value.rating 1 10 %}-000000.png" style="height:14px;" /></td>
<td>
<p style="padding-top:1px;padding-left:2px;font-size:14px;">{{ value.count }} {% if value.count > 1 %} Reviews {% endif %}{% if value.count == 1 %} Review {% endif %}</p>
</td>
</tr>
</tbody>
</table>
{% endif %} {% endfor %} {% endwith %}
If you’d like to update the star colour, update the 000000.png section in the code. If it doesn't work, please contact success@okendo.io. We will create a ticket and upload the colour to our system, which takes around 3 business days. It won't reflect in the code until we do this.
To insert a reviews block, please see our help article here.