--- title: "Adding the Reviews Widget 3.0" slug: "customizing-the-reviews-widget" tags: ["Shopify", "Shopify Plus", "Reviews ", "BigCommerce"] updated: 2026-07-30T09:57:04Z published: 2026-07-30T09:57:04Z canonical: "support.yotpo.com/customizing-the-reviews-widget" --- > ## Documentation Index > Fetch the complete documentation index at: https://support.yotpo.com/llms.txt > Use this file to discover all available pages before exploring further. # Customizing the Reviews Widget Products Reviews ###### Supported plans Free, Starter, Pro, Premium, Enterprise ###### eCommerce Platform Shopify, Shopify Plus, BigCommerce ## Goals and Outcomes The Reviews Widget lets you showcase your reviews on your homepage and product pages in a fully customizable format. In this article, you'll learn how to use the widget editor to match your brand's tone and voice to create a seamless customer experience. ## Accessing the Widget Editor Use the flow below to access the new widget editor: 1. From your Yotpo Reviews main menu, go to [**On-Site Widgets**](https://reviews.yotpo.com/#/display-reviews/on-site-widgets). 2. Click **Reviews Widget 3.0**. 3. Customize the widget according to your needs. > [!CAUTION] > Note > > If you haven't yet added the widget to your store, click on the platform relevant to you to learn how to add it: > > - [Shopify](/v1/docs/adding-the-reviews-widget-30) > - [BigCommerce](/v1/docs/adding-30-widgets-to-bigcommerce-stencil) > - [Adobe Commerce](https://support.yotpo.com/docs/adobe-commerce-2-setting-up-yotpo-reviews-extension-400#setting-up-your-widgets) > - [WooCommerce](https://support.yotpo.com/docs/woocommerce-installing-yotpo#3-installing-yotpo-elements-on-product-pages) ## Customization Options ### Layout Choose a layout for your widget. This option is available in the Layout section of the Reviews Widget Editor. | **Layout** | **Description** | | --- | --- | | Standard | A straightforward layout with 3 columns. | | Bold | A grid layout that emphasizes key-converting content such as media and reviews with high star ratings. Reviews with a star rating of 4 and above showcase larger titles. | ### Colors & Style Define the colors, fonts, and other look and feel settings for your widget. These options are available in the **General Settings** section of the Reviews Widget Editor. | **Setting** | **Description** | | --- | --- | | Primary color | The color used for the aggregated star rating, filler icons, tab names, “Write A Review” button, and shopper status. | | Stars | The color used for the stars. | | Text | The color used for the Yotpo logo, title, aggregated reviews, shopper names, avatars, filter icon, and pagination. | | Background | The background color of the Reviews Widget on the product page on your website. | | Primary font | The font used for your widget header, review title, store comment title, etc. [Learn how to add a custom font](/v1/docs/adding-a-custom-font-to-your-widget). | | Secondary font | The font used by any widget elements not using the primary font. [Learn how to add a custom font](/v1/docs/adding-a-custom-font-to-your-widget). | | Widget width | The relative size of the widget as a percentage of the container size on your product page. | | Reviews per page | The number of reviews you’ll display on each page of the widget. | | Line separator style | The line that is displayed between each review. | ### Reviews Summary The Reviews Summary makes it easier for shoppers to quickly find the information they need by highlighting the main topics that appear across existing reviews in the Reviews Widget. To learn more, see [Adding the Reviews Summary](/v1/docs/adding-the-reviews-summary). ### Widget Header Define the headline text and star rating text. These options are available in the **Widget Header** section of the Reviews Widget Editor. | **Setting** | **Description** | | --- | --- | | Headline text | When on, it displays a header at the top of the Reviews Widget. Default: On | | Text | The text that is displayed at the top of the Reviews Widget. Default: Customer Reviews | | Average star rating | When on, it displays the average star rating for the product at the top of the widget. Default: On | | BottomLine Text | The text that is used in the star rating. Default: {{reviews_count}} reviews | | Star distribution | When on, it displays the number of reviews that were submitted per star rating. Default: On | | Disable write a review button | When on, shoppers will only be able to read reviews, but will not be able to leave reviews through the widget. | | Media Gallery | When on, it displays a gallery of customer-generated photos and videos in the header of the Reviews Widget. Learn more about the [Media Gallery](https://support.yotpo.com/docs/reviews-media-gallery). Default: On The Media Gallery is only available for Pro plans and above. | | Minimum media | Display the reviews gallery only on product pages that have at least this minimum number of published media. | | Headline text | The text that will appear as a header above the gallery. | ### Sorting & Filtering Define the on-site sorting logic and filtering options available to customers These options are available in the **Sorting & Filtering** section of the Reviews Widget Editor. **Sort by** The order in which reviews are displayed on-site in the Reviews Widget. The parameters include: | Parameter | **Description** | | --- | --- | | Most relevant | High-scoring reviews that are the most relevant to the shopper. Each review is given a score according to the following parameters: - **Media**: Reviews with images or videos will get a higher score. - **Review length**: Reviews containing between 30-250 characters get higher scores. - **Number of topics** (Only available for reviews in English): Reviews that have between 1-5 topics get higher scores. - **Reviewer badge**: Reviews that have a “Verified buyer” badge get higher scores. - **Recency**: Newly added reviews get higher scores. | | Most recent | Newly added reviews. | | With media | Reviews that include images or videos. | | Verified purchase | Reviews with “Verified buyer” badges. To learn more about reviewer badges, see the [Reviewer Badges](https://support.yotpo.com/docs/reviewer-badges) article. | | Rating | The average product rating. | **Filter by** The on-site filters are available to customers when viewing reviews: - Free text search - Star rating - Reviews with images & videos - Country - Variants **Smart filters** Smart Filters let shoppers filter reviews by topics that interest them the most. Using AI, these topics are automatically selected according to their prominence in reviews and showcased on-site in a dynamic display. To learn more about Smart Filters, see [Reviews Widget Smart Filters](https://support.yotpo.com/v1/docs/reviews-widget-smart-filters). ### Custom Questions Define the display of information collected with the [Custom Questions feature](/v1/docs/adding-custom-questions-to-your-review-requests). These options are available in the **Custom Questions** section of the Reviews Widget Editor. | **Setting** | **Description** | | --- | --- | | Product feedback | The display location/s and color of product feedback. Default: Off | | Customer details | The display location/s of customer details. Default: Off | ### Reviews Define the display settings for your reviews and comments. These options are available in the **Reviews** section of the Reviews Widget Editor. | **Setting** | **Description** | | --- | --- | | Avatar | When on, it displays the customer's avatar. Default: On **Note**: The reviewer name is the name provided by the user the first time they leave a review. Even if that same user later changes the name associated with their email account, the initial name will continue to be applied to all future reviews. | | Style | Choose to display either an icon or the shopper’s initials. Default: Icon | | Reviewer name format | Choose to display either the shopper’s first name and initial or their initials only. Default: First name + initial | | Reviewer badge | When on, it displays a badge to indicate the authenticity of the reviewer. Learn more about [reviewer badges](/v1/docs/reviewer-badges) Default: On | | Country flag | When on, it displays the country where the review originated. | | Variant Show variants in reviews | When on, it displays the product variant associated with the review, e.g. “Color: Green” or “Size: Large.” Default: On **Notes**: - Customers will only see variants associated with reviews. For example, if the green backpack has no reviews, “green” will not appear as an option in the Color filter dropdown. - Reviews without variants will be displayed when "All Variants" is selected. - The variant features are only available for Shopify and Shopify Plus on Pro plans and above. | | Date | When on, it displays the date the review was submitted. Default: On | | Date format | The date format. Default: DD/MM/YY | | Store comment title | The title displayed above any comments you submit. Default: Store Owner | | Link to original product | Shoppers will see a clickable link to the original product that was reviewed. There are two separate toggles you can enable: - For grouped products - For syndicated reviews | | Shopper feedback | When on, it allows shoppers to vote how helpful a review is by giving it a thumbs up or down. | ### Empty State Define what your widget looks like before you’ve started displaying reviews. These options are available in the **Empty State** section of the Reviews Widget Editor. | **Setting** | **Description** | | --- | --- | | Empty State | When on, and you haven’t published any reviews yet, it displays text inviting shoppers to submit a review. Default: On | | Title text | The title of the empty state. | | Body text | The body text of the empty state. | | Button text | The button text of the empty state. | | Button color | The color of the button in the empty state. | ## Next Steps If the Reviews Widget is already live on your site, the next step is to add the Star Rating 3.0. ## Related - [Adding the Reviews Widget to Shopify](/adding-the-reviews-widget-to-shopify.md) - [Adding the Star Rating to Shopify](/adding-the-star-rating-to-shopify.md)