Adding a review GIF into your abandoned cart emails will dynamically display and rotate through the most recent 5-star published reviews per product.
Add the Product Review Block Data Feed
⚠️ Note: You'll need to contact your Customer Success Manager so that they can send you the appropriate Feed URL.
Navigate to your Data Feeds in Klaviyo and add a new web feed using the below:
Feed URL: Contact your Customer Success Manager at Okendo
Required name: product_reviews_gifs
Request Method: GET
Content Type: JSON
Adding the Review Block
Drag and drop a new text block into your email where you'd like the review gif to show.
Click on the new Text block and click "Source" on the left panel to remove any existing dummy copy. Copy the entire code below and paste the code into your source panel, then click save.
⚠️ Note: The data feed will be automatically enabled.
{% for value in feeds.product_reviews_gifs %}{% if event.ProductID|slugify == value.productId %}
<table class="kmImageBlock" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; table-layout: fixed; min-width: 100%;" border="0" width="100%" cellspacing="0" cellpadding="0">
<tbody class="kmImageBlockOuter">
<tr>
<td class="kmImageBlockInner" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; table-layout: fixed; padding: 0px; padding-right: 9; padding-left: 9;" valign="top">
<table class="kmImageContentContainer" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; table-layout: fixed; min-width: 100%;" border="0" width="100%" cellspacing="0" cellpadding="0" align="left">
<tbody>
<tr>
<td class="kmImageContent" style="border-collapse: collapse; mso-table-lspace: 0; mso-table-rspace: 0; table-layout: fixed; padding: 0; font-size: 0; text-align: center;" valign="top"><a href="{{ event.extra.checkout_url }}" style="word-wrap: break-word; max-width: 100%; color: #fff; font-weight: normal; text-decoration: underline;" target="_blank" rel="noopener"><img class="kmImage" style="border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; max-width: 1200px; padding-bottom: 0; display: inline; vertical-align: top; font-size: 12px; width: 100%; padding: 0; border-width: 0;" src="{{ value.gifUrl }}" alt="Welcome back" width="582" align="center" /> </a></td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
{% endif %}{% endfor %}