Customize the Review Widget Display Settings
Plans: Essentials, Pro, Enterprise Platforms: Shopify
Activate the review widget in AfterShip Reviews to show customer reviews on Shopify and Shopify plus product pages. To hide the product ratings, simply deactivate the widget.
In this article, we will show you:
Activate the review widget
Customize the review widget
Log in to your AfterShip Reviews account.
Go to Display settings and select Reviews widget.
Enable the review widget by shifting the toggle to the right.
Select/unselect AfterShip Branding to show below your review section based on your requirements.
Once enabled, the customer reviews section will star displaying on your Shopify store.
Click Customize on the review widget page to edit the look and feel of the widget and to make it consistent with your brand image.
You will get the following settings.
You get three options to change the widget layout: Slider, Grid, List, and Split.
Choose the one that compliments the appearance of your store.
You can let your customers filter reviews based on:
All reviews
Reviews with photo/video
Additionally, you can let your customers sort reviews based on the different options available:
Most relevant: This sorts reviews based on how closely they match what the customer is looking for.
Highest ratings first: This sorts and displays the highest-rated reviews.
Lowest ratings first: This sorts and displays the lowest-rated reviews.
Most recent: This sorts and lists the newest reviews for the customer.
Most helpful: This feature sorts reviews that other customers have marked as helpful.
You can encourage your customers to leave reviews on your website by showing a Write a review button on your widget. Just enable Show button and customize the review form from the Content section (Covered below).
Under the widget header, you can
Change the title of the reviews header.
Set alignment of the reviews header—left or center.
Choose whether to show or hide the star distribution.
Choose a default header image that will be display on all the product pages, or you can add product pages and use custom images for their widget header instead of the default header image
Select what information you wish to display with the reviews and click Manage display settings to customize how some items are displayed.
Reviewer name: Tick the checkbox (if unchecked) if you want to show your reviewers' names as well. You can choose how you want reviewers' names to appear on your store. Under Manage display settings, there are 3 options available:
Show full name (e.g. Tony Johnson)
Show first name with last name initial (e.g. Tony J.)
Show anonymously (e.g. Txxxn)
Country/region flag: Tick the checkbox to show the respective countries of reviewers. Upon clicking, the country flag will be shown in the review content.
Review date: Tick the checkbox if you want to show the dates of your reviews. Under Manage display settings, you can choose the reviews date format from the available options.
MM/DD/YYYY
DD/MM/YYYY
DD.MM.YYYY
YYYY-MM-DD
MMM DD, YYYY (Here MMM symbolizes the first three alphabets of the month)
Sharing buttons: Tick the checkbox if you want to enable your store visitors to share your product reviews on social media platforms (Facebook and X).
Enabling sharing button on your review widget will have a direct impact on the referral program settings especially if you have selected Reviews shared via the sharing buttons on your review widget sharing method for customers to qualify for a discount. These are the customers who intend to directly share the existing reviews on social media for referral coupons.
If you don't want such customers to receive referral discount for sharing existing reviews, either disable the Share button in the Review widget settings or unselect the Reviews shared via the sharing buttons on your review widget sharing method in the referral program settings * for customers to qualify for a discount. Learn more
Helpful button: Tick the checkbox if you want to take feedback from your users on whether the review was helpful or not. Under Manage display settings, you can choose if you want to give customers the option of Helpful or Helpful/Unhelpful both to provide their honest feedback.
Verified badge: Use this option to bring authenticity to your reviews. You can either use the default verified badge or upload your own customized one under Manage display settings.
The display settings for the available review content items will be applied to reviews in the Reviews widget, Featured reviews, Reviews side tab, and All reviews widget.
Under the Review form section, you can customize the title of your review form. This is the form where the customers will leave the review.
You can choose what to display on your review form under the AfterShip Reviews Settings section.
Under the Style tab, you can easily set the font and colors of your reviews widget including, widget header, and buttons and can also customise the thumbnail size for photos and videos.
Sure! Here’s a breakdown of the style settings for the Reviews widget and All Reviews widget:
This allows you to customize the appearance of the Reviews widget to fit your site’s design.
Display Settings:
Typography: This section allows you to customize the font settings.
Font: You can choose the desired font from the list or use the theme’s default font. In case you're not able to find the desired Font, contact our support team for help.
Size: Adjust the size of the text.
Photo/Video Thumbnails:
Size: Thumbnails will be displayed in the selected size— Small, Medium, or Large, specifically in the split layout.
Corner Radius:
Button: Select the radius size— Small, Medium, or Large of the corners of buttons.
Reviews: Select the corner radius size— Small, Medium, or Large of the review items, applicable in the split layout.
Spacing:
Review Content: Select the size— Small, Medium, or Large of the spacing around the review content, again only in the split layout.
Color Settings:
A. Reviews Widget
Stars: Select the color for the stars rating.
Text: Select the color for the text of the review widget.
Review cards: Set the background color for individual review cards.
Review widget background: Set the background color of the review widget.
B. Widget header
Background and stars: Set the background color of the header and the color of the stars.
C. Button
Button background: Set the background color for buttons.
Button text: Set the color for text in the buttons.
Once done, Save your changes.
Overview
Activate the review widget in AfterShip Reviews to show customer reviews on Shopify and Shopify plus product pages. To hide the product ratings, simply deactivate the widget.
What you’ll learn
In this article, we will show you:
Activate the review widget
Customize the review widget
Activate the review widget
Log in to your AfterShip Reviews account.
Go to Display settings and select Reviews widget.
Enable the review widget by shifting the toggle to the right.
Select/unselect AfterShip Branding to show below your review section based on your requirements.
Once enabled, the customer reviews section will star displaying on your Shopify store.
Customize the review widget
Click Customize on the review widget page to edit the look and feel of the widget and to make it consistent with your brand image.
You will get the following settings.
Settings
1. Layout
You get three options to change the widget layout: Slider, Grid, List, and Split.
Choose the one that compliments the appearance of your store.
2. Filter and Sort
You can let your customers filter reviews based on:
All reviews
Reviews with photo/video
Additionally, you can let your customers sort reviews based on the different options available:
Most relevant: This sorts reviews based on how closely they match what the customer is looking for.
Highest ratings first: This sorts and displays the highest-rated reviews.
Lowest ratings first: This sorts and displays the lowest-rated reviews.
Most recent: This sorts and lists the newest reviews for the customer.
Most helpful: This feature sorts reviews that other customers have marked as helpful.
3. Write a review button
You can encourage your customers to leave reviews on your website by showing a Write a review button on your widget. Just enable Show button and customize the review form from the Content section (Covered below).
Content
1. Widget header
Under the widget header, you can
Change the title of the reviews header.
Set alignment of the reviews header—left or center.
Choose whether to show or hide the star distribution.
Choose a default header image that will be display on all the product pages, or you can add product pages and use custom images for their widget header instead of the default header image
2. Review content
Select what information you wish to display with the reviews and click Manage display settings to customize how some items are displayed.
Reviewer name: Tick the checkbox (if unchecked) if you want to show your reviewers' names as well. You can choose how you want reviewers' names to appear on your store. Under Manage display settings, there are 3 options available:
Show full name (e.g. Tony Johnson)
Show first name with last name initial (e.g. Tony J.)
Show anonymously (e.g. Txxxn)
Country/region flag: Tick the checkbox to show the respective countries of reviewers. Upon clicking, the country flag will be shown in the review content.
Review date: Tick the checkbox if you want to show the dates of your reviews. Under Manage display settings, you can choose the reviews date format from the available options.
MM/DD/YYYY
DD/MM/YYYY
DD.MM.YYYY
YYYY-MM-DD
MMM DD, YYYY (Here MMM symbolizes the first three alphabets of the month)
Sharing buttons: Tick the checkbox if you want to enable your store visitors to share your product reviews on social media platforms (Facebook and X).
Enabling sharing button on your review widget will have a direct impact on the referral program settings especially if you have selected Reviews shared via the sharing buttons on your review widget sharing method for customers to qualify for a discount. These are the customers who intend to directly share the existing reviews on social media for referral coupons.
If you don't want such customers to receive referral discount for sharing existing reviews, either disable the Share button in the Review widget settings or unselect the Reviews shared via the sharing buttons on your review widget sharing method in the referral program settings * for customers to qualify for a discount. Learn more
Helpful button: Tick the checkbox if you want to take feedback from your users on whether the review was helpful or not. Under Manage display settings, you can choose if you want to give customers the option of Helpful or Helpful/Unhelpful both to provide their honest feedback.
Verified badge: Use this option to bring authenticity to your reviews. You can either use the default verified badge or upload your own customized one under Manage display settings.
The display settings for the available review content items will be applied to reviews in the Reviews widget, Featured reviews, Reviews side tab, and All reviews widget.
3. Review form
Under the Review form section, you can customize the title of your review form. This is the form where the customers will leave the review.
You can choose what to display on your review form under the AfterShip Reviews Settings section.
Style
Under the Style tab, you can easily set the font and colors of your reviews widget including, widget header, and buttons and can also customise the thumbnail size for photos and videos.
Sure! Here’s a breakdown of the style settings for the Reviews widget and All Reviews widget:
Style
This allows you to customize the appearance of the Reviews widget to fit your site’s design.
Display Settings:
Typography: This section allows you to customize the font settings.
Font: You can choose the desired font from the list or use the theme’s default font. In case you're not able to find the desired Font, contact our support team for help.
Size: Adjust the size of the text.
Photo/Video Thumbnails:
Size: Thumbnails will be displayed in the selected size— Small, Medium, or Large, specifically in the split layout.
Corner Radius:
Button: Select the radius size— Small, Medium, or Large of the corners of buttons.
Reviews: Select the corner radius size— Small, Medium, or Large of the review items, applicable in the split layout.
Spacing:
Review Content: Select the size— Small, Medium, or Large of the spacing around the review content, again only in the split layout.
Color Settings:
A. Reviews Widget
Stars: Select the color for the stars rating.
Text: Select the color for the text of the review widget.
Review cards: Set the background color for individual review cards.
Review widget background: Set the background color of the review widget.
B. Widget header
Background and stars: Set the background color of the header and the color of the stars.
C. Button
Button background: Set the background color for buttons.
Button text: Set the color for text in the buttons.
Once done, Save your changes.
Updated on: 14/11/2024
Thank you!