REVIEWS.IO offers the ability to show latest company or product reviews in your Klaviyo emails. This is especially good for abandoned cart emails.
Navigation π
Navigate to Integrations >> Klaviyo
Company Review Content
Displaying Your Latest 5-Star Review In Your Klaviyo Email Templates
1) In Klaviyo, click your user name in the bottom left navigation, then click Settings and then the "Web Feed" button and finally "Add Web Feed"
2) Enter the name "ReviewsIOReviews" and the URL
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=store_review
The Request Method should be set to "GET" and the Content Type should be "JSON".
3) You'll now be able to display your latest 5-star reviews in your Klaviyo email templates. To get started, create a new text block in your email template, click the source button and add the following:
{% for review in feeds.ReviewsIOReviews.reviews | slice: "3" %}
<table cellpadding="0" cellspacing="0" background="#ffffff" style="background-color:#ffffff;width:100%" width="100%">
<tbody>
<tr>
<td style="padding-bottom:15px;">
<div style="background-color:#fff;border-radius:6px;border-bottom:1px solid #e1e2e4;padding:10px 15px 20px;">
<p style="font-size:14px;margin:0;">
<b>###{{ review.reviewer.first_name }}</b>
<span style="font-size:18px; color:#f47e27; letter-spacing:2px;" color="#f47e27">
{% if review.rating == 5 %}
β β β β β
{% elif review.rating == 4 %}
β β β β
{% elif review.rating == 3 %}
β β β
{% elif review.rating == 2 %}
β β
{% elif review.rating == 1 %}
β
{% endif %}
</span>
</p>
<p style="font-size:14px; margin:0;">
"###{{ review.comments | truncatechars: "128" }}"
</p>
<p style="font-size:12px;text-align:right;color:#ccc; margin:0;">
###{{ review.date }}
</p>
</div>
</td>
</tr>
</tbody>
</table>
{% endfor %}
Product Review Content
Displaying Your Latest 5-Star Product Review In Your Klaviyo Email Templates
1) Follow the above instructions to add a Data Feed to Klaviyo.
Enter the name "ReviewsIOProductReviews" and the URL
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=product_review
2) If you like to show reviews for a specific product, add a SKU parameter to the URL, eg
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=product_review&sku=ABC-123.
3) You'll now be able to display your latest 5 star product reviews in your Klaviyo email templates. To get started, create a new text block in your email template, click the source button and add the following:
{% for review in feeds.ReviewsIOProductReviews.reviews | slice: "3" %}
<table cellpadding="0" cellspacing="0" background="#ffffff" style="background-color:#ffffff;width:100%" width="100%">
<tbody>
<tr>
<td style="padding-bottom:15px;">
<div style="background-color:#fff;border-radius:6px;border-bottom:1px solid #e1e2e4;padding:10px 15px 20px;">
<p style="font-size:14px;margin:0;">
<b>###{{ review.reviewer.first_name }}</b>
<span style="font-size:18px; color:#f47e27; letter-spacing:2px;" color="#f47e27">
{% if review.rating == 5 %}
β β β β β
{% elif review.rating == 4 %}
β β β β
{% elif review.rating == 3 %}
β β β
{% elif review.rating == 2 %}
β β
{% elif review.rating == 1 %}
β
{% endif %}
</span>
</p>
<p style="font-size:14px; margin:0;font-style:italic">
Reviewed: ###{{ review.product_name }}
</p>
<p style="font-size:14px; margin:0;">
"###{{ review.comments | truncatechars: "128" }}"
</p>
<p style="font-size:12px;text-align:right;color:#ccc; margin:0;">
###{{ review.date }}
</p>
</div>
</td>
</tr>
</tbody>
</table>
{% endfor %}
Instagram & UGC Content
Display UGC from Instagram, and your reviews
Follow the above instructions to add a Data Feed to Klaviyo. Enter the name "ReviewsIOInfluencers" and the URL
https://api.reviews.co.uk/instagram/widget?store=[YOUR STORE KEY]&include_image_url=1
When the above step is done, you'll be able to add UGC galleries to your Klaviyo emails. To do so, go to UGC Widget Editor, click the Embed in Klaviyo Email button, select the gallery layout you prefer and use the provided code in your Klaviyo emails.
Product Specific Review Feed
Display 5-star product reviews, based on the SKUs within the email
Follow the above instructions to add a Data Feed to Klaviyo. Enter the name "ReviewsSkuFeed" and the URL:
Copy
https://api.reviews.co.uk/product/ratings/klaviyo-feed?store=[YOUR STORE KEY]
Create a new text block in your email template, click the source button and add the following code. Don't forget to ensure you are using the new feed for the email you're updating.
<table cellpadding="0" cellspacing="0" background="#ffffff" style="background-color:#ffffff;width:100%" width="100%">
<tbody>
{% for lineItem in event.extra.line_items %}
{% for review in feeds.ReviewsSkuFeed.reviews %}
{% if lineItem.sku == review.sku %}
<tr>
<td style="padding-bottom:15px;">
<div style="background-color:#fff;border-radius:6px;border-bottom:1px solid #e1e2e4;padding:10px 15px 20px;">
<p style="font-size:14px; margin:0;">
"###{{ review.review | truncatechars: '128' }}"
</p>
<p style="font-size:14px; margin:0;font-style:italic">
Reviewed: ###{{ review.name }}
</p>
<p style="font-size:14px;margin:0;padding-bottom:0;">
<span style="font-size:18px; color:#f47e27; letter-spacing:2px;" color="#f47e27">
{% if review.review_rating == 5 %}
β β β β β
{% elif review.review_rating == 4 %}
β β β β
{% elif review.review_rating == 3 %}
β β β
{% elif review.review_rating == 2 %}
β β
{% elif review.review_rating == 1 %}
β
{% endif %}
</span>
<b>###{{ review.reviewer }}</b>
</p>
</div>
</td>
</tr>
{% endif %}
{% endfor %}
{% endfor %}
</tbody>
</table>
Product Review Block
Display 5-star product reviews alongside product information
Follow the above instructions to add a Data Feed to Klaviyo. Enter the name "ReviewsSkuFeed" and the URL:
https://api.reviews.co.uk/product/ratings/klaviyo-feed?store=[YOUR STORE ID]
Select Review Aggregate to show an overall product rating, or Product Review to display the latest 5-star review
Create a new text block in your email template, click the source button and add the following code. Don't forget to ensure you are using the new feed for the email you're updating.
<table cellpadding="0" cellspacing="0" background="#ffffff" style="background-color:#ffffff;width:100%" width="100%">
<tbody>
{% for review in feeds.ReviewsSkuFeed.reviews %}
{% if item.sku == review.sku %}
<tr>
<td style="padding-bottom:15px;">
<p style="font-size:14px;margin-top:0;padding-bottom:0px;">
<span style="font-size:18px; color:#f47e27; letter-spacing:2px;" color="#f47e27">
{% if review.rating_rounded == 5 %}
β β β β β
{% elif review.rating_rounded == 4 %}
β β β β
{% elif review.rating_rounded == 3 %}
β β β
{% elif review.rating_rounded == 2 %}
β β
{% elif review.rating_rounded == 1 %}
β
{% endif %}
</span>
<b>###{{ review.rating }} / 5</b>
</p>
<p style="font-size:14px;margin:0;padding-bottom:0;">
from <b>###{{ review.review_count }}</b> reviews
</p>
</td>
</tr>
{% endif %}
{% endfor %}
</tbody>
</table>
An example of how this looks using the 'Product Review' option:
Product Review Social Proof
Display a social proof image, generated based on the first SKU within the email
First, select the background you'd like to use. By default, the system will use a random background from our preexisting collection of images
Then follow the above instructions to add a Data Feed to Klaviyo. Enter the name "ReviewsSkuFeed" and the URL:
https://api.reviews.co.uk/product/ratings/klaviyo-feed?store=[YOUR STORE ID]&background_random=image
Then create a new text block in your email template, click the source button and add the following code. Don't forget to ensure you are using the new feed for the email you're updating.
<table background="#ffffff" cellpadding="0" cellspacing="0" style="background-color:#ffffff;width:100%" width="100%">
<tbody>
{% for lineItem in event.extra.line_items %}
{% if forloop.counter == 1 %}
{% for review in feeds.ReviewsSkuFeed.reviews %}
{% if lineItem.sku == review.sku %}
<tr>
<td style="text-align: center;">
<img src="###{{ review.social_proof }}" style="width: 100%;" />
</td>
</tr>
{% endif %}
{% endfor %}
{% endif %}
{% endfor %}
</tbody>
</table>
An example of how this looks
Additional Klaviyo Features
NOTE: βIf you use our review tagging feature which tags reviews with user language, you can add that to as a data feed URL if required:
eg:
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=store_review
becomes:
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=store_review&tag=FR
For French reviews only.β
To show only reviews with comments, the data feed will become:
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=store_review
becomes:
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=store_review&must_have_body=1
To show 4 and 5-star reviews, the data feed will become:
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&rating=5&type=store_review
becomes:
https://api.reviews.co.uk/klavio/reviews/data?store=[YOUR STORE KEY]&per_page=3&minRating=4&type=store_review
To show only reviews with comments, the data feed will become:
To change the date format in the widget, If you replace
###{{review.date}}
with
###{{review.date_created|format_date_string|date:'F d, o' }}
You can format the date into different ways. In the above case, it would show a date in this format:
February 11, 2016
The date part can be changed also, for example:
February 26, 2016:
###{{ review.date_created|format_date_string|date:'F d, o' }}
26 February 2016:
###{{ review.date_created|format_date_string|date:'d F o' }}
02-26-2016:
###{{ review.date_created|format_date_string|date:'m-d-Y' }}
26-02-2016:
###{{ review.date_created|format_date_string|date:'d-m-Y' }}
2/26/16 (no leading 0s):
###{{ review.date_created|format_date_string|date:'n/j/y' }}
26/2/16 (no leading 0s):
###{{ review.date_created|format_date_string|date:'j/n/y' }}
Feb 11:
###{{ review.date_created|format_date_string|date:'M d' }}
11 Feb:
###{{ review.date_created|format_date_string|date:'d M' }}
Since this is Klaviyo's functionality, we cannot guarantee if using a format that includes month names will translate the months, but there's other options there to just show numerical dates.