Displaying and customizing Star Ratings
Beside of the review widgets (such as review box, review popup and carousel), you will be able to show the star ratings under the product's title. Please check this article for detailed instruction
ENABLE APP EMBED
To have the app worked on your store, you will need to enable Ali Reviews on your theme.
Steps:
- From Shopify Sale channels
- Go to Online Store
- Go to Theme
- Click Customize
- In the App embeds, Enable Ali Reviews Core Snippet
HOW TO ADD STAR RATING
To add the rating stars, please follow those steps:
- Go to Show Reviews → Star Rating → Customize
- Enable Star Rating
- Return to Show Reviews → Star Rating → Install
- Select a theme and page → Click Add Star Rating
- In Theme Editor, drag & drop the Ali Reviews Star Rating to change its position
- Click Save
- Once you enable the app embed, the star rating would be placed in 2 positions: under the title of product page and collection list. If you do not see the star rating showing after enabling the app embed, please kindly check this article for manually installation or contact our support team.
- You are able to turn on/off the star rating by going to Show reviews, then click Star rating, and click Customize and toggle on/of on the top left
- Preposition the star rating:
- On product page for theme OS 2.0: drag-and-drop the star rating app block to the position you want
- On collection page and theme OS 1.0: move the code manually, kindly check this article for more information
CUSTOMIZE STAR RATINGS
You can easily customize the Rating Star's appearance showing for both Product Page and Collection Page. To customize your Star Rating, go to Show Reviews > Star Rating > Customize > Then select either Component Visibility or Style & Appearance to adjust your settings.
- Component Visibility:
- Show widget when there are no reviews: Disable to hide the star rating widget if a product has no review.
- Show star rating detail: Disable to hide the dropdown showing rating details when hovering on stars.
- Style & Appearance:
Star Rating:
- Use global settings for this widget: Enable this option will apply the global settings for star rating.
- Rating icon shape: Choose the star rating icon shape (Default star, thin star, rounded star, Circle, Heart, Paw, Like, Ghost).
- Rating icon spacing: Adjust space between rating icons.
- Rating icon filled color: Change the colors of filled rating icons.
- Rating icon empty color:Change the colors of empty rating icons.
- Show rating icon border: Toggle the rating icon border display.
- Rating icon border color: Customize the rating icon border color.
- Rating icon size: Adjust the rating icon size.
Text Font Size:
- Body text font size: Change size of dropdown text (e.g., “Based on X reviews”).
- Accessory text font size: Change size of rating text (e.g., “4.3 (2.6k reviews)”).
Widget Content: Edit the text and language displayed on the star rating widget.
- Language: Change widget language.
- Add translation language: Go to translation section.
- Editable text fields:
- average rating ([review number] review) - e.g: 4.0 (1 review)
- average rating ([review number] reviews) - e.g: 4.3 (2.6k reviews)
- [Average rating] out of 5 - e.g: 4.3 out of 5
- Based on [Review number] review(s) - e.g: Based on 2.6k reviews
- See all customer reviews
- (no reviews yet)
- Add variable: Insert variables like average rating or review number (auto-filled on storefront).
Notes:
- Preview mode: Switch between Mobile, Desktop, or Fullscreen by clicking the desktop icon on the top right.
- Reset to default: Restore default settings for Appearance or Widget content.
- Enable/disable Star Rating: Use the top-left toggle to show or hide the star rating across all theme templates at once.
Please feel free to contact our Support team via our live chat channel by clicking on the bottom right icon inside app, or our email at support@alireviews.io for further support.
Updated on: 29/10/2025
Thank you!