Adding the Product Reviews Widget to Your Homepage

Show off your customers' reviews on your homepage using the Product Reviews Widget. You can display your entire reviews collection or highlight a specific product.

The article below will walk you through adding the Product Reviews Widget to your homepage using the Shopify Theme editor and its customization options or by adding the widget manually by code.

IN THIS ARTICLE

Adding the widget via the Theme Editor

To add the Product Reviews Widget to your homepage using the Shopify Theme Editor, follow the steps below:

  • Click “Add section” and choose the “Reviews Widget”:

  • Drag and drop the widget's app block where you would like it to appear:

  • Click "Save".

Customization options

Customize the Loox Product Reviews Widget to fit your brand’s look and feel.

The following customization options are available:

  • Display only reviews with photos: Display only reviews, including photos and video. Text-only reviews will not be displayed.
  • Hide product thumbnails: Remove the associated product’ picture and name below each review.
  • Add "write a review" button linked to: Select a specific product to link a dedicated "Write a review" button to. Customers can submit reviews for that product on the homepage.
  • Show reviews from all products (enabled by default): All approved reviews of all products will appear. If disabled, only the reviews of the selected product will appear.
  • Number of reviews to display: Choose how many reviews to display on the Product Reviews Widget before clicking on the “Show more reviews” button.
  • Maximum width: Limit the width and the number of reviews displayed per row of the widget.

Integrating the widget manually

To add the Product Reviews Widget to your homepage manually by code, follow the steps below:

  • Inside the Shopify Themes menu, click the “...” button next to “Customize” and select "Edit code":

  • Open the liquid file you use for your homepage (for example, index.liquid or theme.liquid).
  • Copy the line of code below:
    • To show all reviews:
<div id="looxReviews" data-loox-aggregate data-limit=”20”></div>
    • To only show photo/video reviews:
<div id="looxReviews" data-loox-aggregate data-limit=”20” data-mode="img"</div>
  • Paste the line of code where you want the widget to appear.
  • Click "Save".

If you need help editing your Liquid code, contact our Support team. We’re available 24/7 and happy to help!