Install Product Reviews widget

What is a Product Reviews Widget?

A Product Reviews Widget displays customer reviews and star ratings on your product and category pages, helping you build trust and influence purchasing decisions.

Product Reviews widget is a two-part widget:

Part 1: Product Stars (add reviews & product stars to product pages)

Part 2: Category Stars (add product stars to category/collections pages)

Before You Begin: Get Your Unique Widget Code

1. Log in to your Kundello account
2. Navigate to the Widget section in the main menu
3. Click on Product Reviews
4. Copy your unique widget code
   • This code is specific to your store and account
   • It will look similar to the example code, but it will have your unique identifier.

Step-by-Step Installation Guide

Part 1: Product Stars (add reviews & product stars to product pages)

Step 1. Open the Shopify theme editor

1. Log in to your Shopify admin panel
2. Go to Online Store > Themes
3. Click Actions next to your active theme
4. Select Edit code

Step 2. Find the "main-product.liquid" file

1. In the file directory on the left, open the main-product.liquid file (usually located under Sections).

Step 3. Locate the Product Title Code

1. Use search (Ctrl+F/Cmd+F) to find the product title (see example below)

Example:

<h1>{{ product.title | escape }}</h1>

Step 4. Insert the Product Reviews Code

1. Paste your unique Kundello widget code directly after "<h1>{{ product.title | escape }}</h1>" line.

Here is an example widget code (you need to use your unique code):

<div
  class="cr-widget"
  data-id="f57e5cb1f4532c0081830511892abd4283801fcb5afe2d1c190e3dfd38c4da08042"
  data-sku="{{ product.id }}"
  data-name="{{ product.title }}"
  data-photo="{{ product.featured_image }}">
</div>

Step 5: Save and Verify the Widget

1. Click the Save button in the top-right corner of the theme editor to apply your changes.
2. Open your store and navigate to the page where the widget was added.
3. Verify that the Product Reviews widget appears and functions correctly.

Here are the screenshots that visually explain the steps:

Part 2: Category Stars (add product stars to category pages)

Step 1. Open the Shopify theme editor if it is not already open

1. Log in to your Shopify admin panel
2. Go to Online Store > Themes
3. Click Actions next to your active theme
4. Select Edit code

Step 2. Find the "main-collection-product-grid.liquid" file

1. In the file directory on the left, find and open the "main-collection-product-grid.liquid" file (usually located under Sections or Snippets).
2. Use the search function (Ctrl + F or Cmd + F) to find the following line of code:

<li class="grid__item">

3. Scroll down to locate its closing tag:

</li>

Step 3. Insert the Category Stars Widget Code

1. Paste your unique Kundello widget code inside the <li> tag but before its closing </li>:
2. Instead of "<YOUR PRODUCT ID>" enter "{{ product.id }}"

Here is an example Category stars widget code (you need to use your unique code):

<div class="cr-widget" data-id="eb624dbe56eb6620ae62080c10a273cab73ae8eca98ab17b731446a31c79393a" data-sku="<YOUR PRODUCT ID>"></div>

Step 4: Save and Verify the Widget

1. Click Save: After embedding the code, click the Save button in the top-right corner of the editor.
2. Preview the Category Page: Open your store and navigate to the category (collection) page you updated. The stars should now appear under each product's image and description.

Here are the screenshots that visually explain the steps: