Review badge installation on Shopify store

What is a Product Review Badge? 

Product Review Badge is a rating badge that appears on your product description. 

⚠️ At this time, POWR Product Reviews is only compatible with Shopify and Bigcommerce.

How to install review badge on Shopify product pages? 

⚠️ At this time, only manual installation is available.  

1. Add  Product Review App to your Shopify Store. Learn more how to install the app here.

Learn how to install it on Bigcommerce here.

2. Edit your POWR Product Reviews app and press the publish button in the upper right corner.

3. Copy the Product Review Badge Snippet. 

4. Open your Shopify Store Admin and select Customize Theme.

5. Select Edit Code from the three dots menu in the upper left. 

6. Find the file that makes up your Product Page (usually product-template.liquid for old shops and main-product.liquid for 2.0 shops like the Dawn theme) and paste your badge code below the title. Search the file for “product.title” if you have trouble finding the correct line. This should look something like this:

<h1 class="product-single__title"> { { product.title } }</h1>

Then Save. 

7. Preview your Products

How to Install Product Reviews Badge on Catalog Pages?

1. Follow the same instructions for installing the Badge on Product pages, until you get to the code editor.

2. Instead of looking for the product-template file, we will look for product-card-grid.liquid or a similar file such as card-product.liquid for Dawn and other 2.0 themes. 

3. Follow the same directions above to find  a line of code with product.title.  There may be more than one. The one you want will likely be in a h1, h2, h3, etc type of tag or have that class on it... here's an example:

<div class="h4 grid-view-item__title product-card__title" aria-hidden="true">{{ product.title }}</div>

(Dawn theme/Shopify 2.0 themes: if the file you update shows `card_product.title` instead of `product.title`, you may need to update the code that you paste into the file to match this by updating `product.id` in the code snippet to `card_product.id`)

4. Paste the Product Reviews Badge Snippet that you copied from the Publish screen below this line of code and save.

When we refresh the Shopify shop catalog page, we should see badges on all of the products:

I can't see files product-card-grid.liquid or card-product.liquid in my Shopify store, where should I install Review badges on Catalog pages then?

In case, you could not find the product-card-grid.liquid or card-product.liquid please look for small-product-item.liquid  and static-collection.liquid.

Step 1. Copy 1st part of the code

Example: <script> window.powrShopMetafields = {{shop.metafields.powr | json}} </script><script type="text/javascript" async="" src="https://www.powr.io/powr_product_review_badge.js"></script>

Step 2. Paste this code into static-collection.liquid.  AFTER </script>

Save the changes.

Step 3. Copy the 2nd part of the code

Example: <div class="product-reviews-badge-powr" data-app-id="c4373f8b_1650314926" data-product-id="{{product.id}}"></div>

Step 4. Paste the code into small-product-item.liquid

Save the changes.

Step 5. After saving the changes, please refresh the page to check if review badges have been installed on Catalog pages.

Do star ratings appear in Google search results?

Yes. When product pages with Product Review app are surfaced in Google, the Google result shows the overall star rating.