Shopify Product Reviews Integration guide

Here is the guide for Shopify Product Reviews Integration with Boost Product Filter & Search app.

About Shopify Product Reviews

App Information

  • Shopify Product Reviews allows you to add a customer review feature to your products. This provides a way for your customers to engage with you, as well as each other to encourage sales.
  • App details:
  • 2
    Shopify Product Reviews Integration Benefit

    • Display reviews/ratings in the product item.
    • Display a filter option by ratings/reviews.

    Demo of Shopify Product Reviews Integration

    Here is our customer's store with our app and Shopify Product Reviews (Shopify) integration.

    Display reviews/ratings in the product item.

    Display reviews/ratings in the product item.

    Display a filter option by ratings/reviews.

    We have not yet received any request to display a filter option by ratings/views with Product Reviews (Shopify). However, it should be exactly like in the screenshot.

    Display a filter option by ratings/reviews


    Attention: The current document only works with the new front-end lib from Boost Commerce. Please read this document first to know if you are using the latest version.

    Build Rating for the Product item

    Edit your current theme.
    Copy the following code snippet to your clipboard:
    //For boost-pfs-filter.js
    '<span class="shopify-product-reviews-badge" data-id="{{itemId}}"></span>' +
    //For boost-pfs-filter-html.liquid
    <span class="shopify-product-reviews-badge" data-id="[[itemId]]"></span>
    Go to the boost-pfs-filter.js file, then find productGridItemHtml and paste the snippet to where you want the Ratings to appear, for example, under the product title:
    Shopify Product Reviews Integration
    If  productGridItemHtml variable does not exist, please check the file boost-pfs-filter-html.liquid:
    Shopify Product Reviews Integrate
    Go again the boost-pfs-filter.js file, then paste the content below to the  ProductList.prototype.afterRender function.
    if (window.SPR) {

    Build a filter option by ratings/reviews

    Please go to Product Filter & Search -> Tool -> Metafields
    Add the new metafield like the image below:
    Namespace: spr
    Key: reviews

    How to edit metafield to prepare for the integration

    Build a filter option by ratings/reviews.
    Wait about 3 minutes for the syncs done before creating a filter option by review ratings: Go to the app's Homepage > Manage Filter tree > From a filter tree, click Add a filter option button > Choose Review Ratings > Click 2 Save buttons. Refer to  this article for more details.

    Still need help? Contact Us Contact Us