Follow instructions below to install star rating on BigCommerce product cards across your store (home page, category pages, search results, and product recommendations)

To start, go to star ratings page and add star rating.


Demo Store

View demo store to see the widgets live in BigCommerce store.


Placement Options

Product Card (Auto) -Will automatically show star ratings on product cards across your store (home page, category pages, search results, and product recommendations). Keep in mind that this method may not work for every themes.

Custom Placement - Manually install widget. Use this as fallback if all other placement methods doesn't work.

 

screenshot-2021.10.27-11_25_34.png

Copy ID for star rating and replace STAR_RATING_ID with it for the following snippet.

<div
 class="ov-app ov-app-star-rating"
 data-app-id="STAR_RATING_ID"
 data-app="star-rating"
 data-product-external-id="{{ id }}">
</div>

 

Next, edit BigCommerce theme and locate category view: 

  • templates/components/products/card.html

Search for card-title element. Then paste snippet after it.

screenshot-store-2021.10.27-11_30_36.png

This should position star rating just below product title element in category page.

Star rating not showing for some products?

Go to products page and check if product has been imported to our system. If product has not imported, we won't display star rating.

 

Need help installing?

If you need additional help to install, you can contact us.