Ratings and reviews
Show the average star rating of each product on product cards and the product page, and let customers read and write reviews.
You need: a product reviews app from the Shopify App Store that saves ratings to Shopify’s standard product rating fields · about 20 minutes, plus the time to import or collect reviews.
How ratings get into the theme
Section titled “How ratings get into the theme”Alpha Start doesn’t collect reviews. A reviews app does: it shows the review form and the list of reviews, and saves two numbers to each product:
| Product field | What it holds | Where Alpha Start shows it |
|---|---|---|
Product rating (reviews.rating) |
The average rating, for example 4.6 out of 5. | A star with the rating on product cards, on the product page, in the Featured product section and on the featured product of the header. |
Product rating count (reviews.rating_count) |
The number of reviews. | Next to the rating on the product page, for example “12 reviews”. |
These are standard fields that Shopify defines for all themes and apps. When the app updates them, the theme shows the new numbers. Products without reviews show no stars.
Step 1. Set up a reviews app in Shopify admin
Section titled “Step 1. Set up a reviews app in Shopify admin”- In the Shopify App Store, choose a product reviews app and install it.
- In the app’s documentation or settings, check that it saves ratings to Shopify’s standard product rating fields. Apps often call this “sync ratings to Shopify metafields” or “Shopify standard metafields”. Loox, Fera and Klaviyo Reviews, for example, describe this in their help centers. For other apps, ask the app’s support.
- Turn that option on, if the app has one, and import or collect your first reviews.
Step 2. Show ratings and the review widget in the theme editor
Section titled “Step 2. Show ratings and the review widget in the theme editor”Stars on product cards
- Open Theme settings → Product cards.
- Turn on Show product rating. Info in the editor: “Requires a product reviews app”.
- Click Save.
The rating appears as a small badge on the product image, next to the stock status when Show stock status is on.
Stars on the product page
- Open a product page in the theme editor: Products → Default product.
- Under Product, check that the Rating block is there. If not, click Add block → Rating. Info in the editor: “Shows the rating saved by a product reviews app.”
- Click Save.
In the Classic layout the rating sits at the top of the purchase column, in the Showcase layout in the row under the title, and in the Gallery layout in the order of the blocks.
The review widget
The list of reviews and the review form come from the app as an app block or an app embed.
- Under Product, click Add block and open the Apps tab. Choose the app’s review block, for example a star summary or a reviews list. App blocks of the Product section go into the purchase column, in the order of the blocks.
- For a full-width list of reviews under the product, click Add section below the Product section and choose the app’s block in the Apps tab, if the app offers it there.
- If the app works through an app embed, click the App embeds icon in the left sidebar and turn the app on.
- Click Save.
See Apps for more about app blocks and app embeds.
Ratings, the reviews app and the Customer reviews section
Section titled “Ratings, the reviews app and the Customer reviews section”The Customer reviews section looks like a reviews feed, but it isn’t connected to any app.
| Reviews app | Customer reviews section | |
|---|---|---|
| Where reviews come from | Customers write them through the app. | You type or paste each review into a Review block. |
| Overall rating | Counted by the app for each product. | You enter Average rating and Number of reviews by hand. |
| Where it appears | Product pages and product cards. | Any page where you add the section, usually the home page. |
| Best for | Product reviews that update on their own. | A few hand-picked quotes about your store. |
You can combine them: the Customer reviews section accepts app blocks too, so you can add your app’s reviews carousel under your hand-picked quotes. See Customer reviews.
Check the result
Section titled “Check the result”Open a product that has reviews in the app. The product page shows the star, the average rating and the number of reviews, and a collection with this product shows the rating on its card. If nothing appears, open the product in your Shopify admin and check that the app has saved a rating for it.
Why don’t stars appear even though the app shows reviews?
Section titled “Why don’t stars appear even though the app shows reviews?”The app shows reviews with its own widget, but it hasn’t saved the rating to Shopify’s standard product rating field. Check the app’s settings for an option to sync ratings, or ask the app’s support. Also check that Show product rating is on and the Rating block is on the product page.
Why do I see two sets of stars on the product page?
Section titled “Why do I see two sets of stars on the product page?”The app adds its own star summary through an app block or app embed, and the theme shows the Rating block. Remove one of them: either the Rating block or the app’s star block.
Can I style the app’s widget to match the theme?
Section titled “Can I style the app’s widget to match the theme?”App widgets are styled by the app. Most reviews apps have color and font settings in the app itself. The theme doesn’t change them.