Shopify - Product Reviews Integration

Get up and running collecting product reviews on Shopify with ResellerRatings Product Review Solution

Step I - Product Catalog Ingestion

Navigate to the Shopify Admin Panel

2. Click on edit code

3. On the left-hand column, identify your product page template file.


{% assign variant = product.first_available_variant %}
<script>
  
  let variantskus = [];
  {% for product_variant in product.variants %}
  variantskus.push({sku: "{{product_variant.sku}}",
                   name: "{{ product.title }}",
                   gtin: "{{product_variant.barcode}}",
                   img: "{{ product.featured_media.preview_image | image_url: width: 500 }}",
                   url: "https://replace.myshopify.com{{ product.url }}",
                   parent_id: "{{ product.title}}"});
  
  {% endfor %}
  
  
var __RRPRWidget_Settings = {
name: "{{ product.title }}",
sku: "{{ variant.sku }}",
gtin: "{{ variant.barcode }}",
img: "{{ product.featured_media.preview_image | image_url: width: 500 }}",
url: "https://REPLACE.myshopify.com{% raw %}{{ product.url }}",
parent_id: "{{ product.title }}",
products: variantskus,
  
        };

</script>
<!--Bottom of your page-->
{% assign variant = product.first_available_variant %}
<script
src="https://www.resellerratings.com/productreviews/widget/javascript/YOUR_SEO_NAME.js?sku={{ variant.sku }}"></script>
{% endfor %}

Within this script, you will need to update the URL tag to correctly display your Shopify domain name. You will also need to find the existing liquid variable being used for your product image to correctly populate the script with a product image link.

You will need to swap out YOUR_SEO_NAME for your ResellerRatings SEO name. Please contact your integration team to obtain this name.

Step II - Review Collection

In your Shopify Admin Panel, navigate to the settings page and then click on "Checkout"

2. Inside the checkout settings, scroll down to the additional scripts panel.

3. Please post this code in the additional scripts panel at the top, if you have multiple scripts in this panel, please place them below our script for full functionality



<script type="text/javascript">
let rrpr_skus = [];
{% for line_item in checkout.line_items %}
if('{{line_item.sku}}'!=='')
{
rrpr_skus.push('{% raw %}{{line_item.sku}}');

}
else
{
console.log('failed to find sku for product_id: {{line_item.product_id}}');
}
{% endfor %}

                   var _rrPR = {
                       seller_id: xxxxxx, 
                       email: "{{ checkout.email }}", 
                       sku:  rrpr_skus ,
                       invoice: "{{ order_number}}"
                           };
                   (function() {
                       var s=document.createElement('script');s.type='text/javascript';s.async=true;
                       s.src="https://www.resellerratings.com/popup/include/load.js";var ss=document.getElementsByTagName('script')[0];
                       ss.parentNode.insertBefore(s,ss);
                   })();
                   </script>

The SellerID will need to be replaced in this script with your current unique SellerID on ResellerRatings, please contact your integration team to receive your SellerID

This dynamic script will be able to collect both Seller Ratings and Product Reviews!

Step III - Review Display

The final step will be to add the Product Review Display Widget to the product pages.

Navigate back to the product template file used for the product catalog script inside the Shopify admin.

2. Place this <div> where you want the widget to render on your site. This will take some trial and error on your side to get the correct rendering on the page, every Shopify theme/store is unique

{% endraw %}<div id="RR_PR_Widget_Wrapper"> </div>{% endraw %}