Skip to main content

Create a dedicated Happy Customers page

Learn how to add the Happy Customers widget to any page on your store to display product and store reviews, and build shopper trust.

Updated yesterday

Available on the Awesome plan.
​

Unlock the Happy Customers widget—and all Judge.me features—with a 15-day free trial of the Awesome plan. Showcase your store's reputation, improve SEO, and turn trust into conversions.

The Happy Customers widget lets you showcase your best reviews in one dedicated place—helping shoppers quickly understand why they can trust your store.

Unlike product-specific review widgets, Happy Customers is designed to highlight your overall store reputation. Merchants commonly use it on a standalone “Reviews” or “Happy Customers” page for SEO, but it can also be added to your homepage, product pages, or collection pages.

Considerations

  • Currently, the new version is not available for pages built with a page builder.

  • The upgrade might take around 5 minutes to finish. We'll keep showing the previous version until the new one is ready.

  • Pinning reviews is not supported at the moment.

Upgrade to the new version

To upgrade your Reviews page to the new version:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers widget > Customize.
    ​

  2. Click the Upgrade now button.
    ​

  3. A confirmation popup will appear, click Upgrade Widget to confirm.

Once you confirm, the upgrade will start automatically.

  • Your widget will stay visible during the process, there's no downtime.

  • The upgrade usually finishes in about 5 minutes.

For vintage themes

  1. Go to Online store and click the 3 dots (...) > Edit code.

  2. Open the template file of the page where your existing widget is installed.

    • For pages previously created automatically by Judge.me, the template name is page.judgeme_reviews.liquid.

  3. Locate the existing widget code.

    • The widget code block starts with <!-- Judge.me reviews -->.

  4. Replace the old widget snippet with the new widget code provided below in the same location.
    ​

    <div id='judgeme_all_reviews_page' class="page clearfix jdgm-all-reviews-page">
      <div class="jdgm-all-reviews-page__wrapper">
        <h1 class="jdgm-all-reviews-page__title">{{ page.title }}</h1>
        <div class='jdgm-all-reviews-page__description'>{{ page.content }}</div>


        <!-- Start of Judge.me code -->
         {% assign has_legacy = false %}{% if shop.metafields.judgeme.all_reviews_header.size > 20 %}{% assign has_legacy = true %}{% endif %}<div class='jdgm-widget jdgm-all-reviews-widget-v2025' data-widget='all-reviews-v2025' data-auto-install='false' data-entry-point='all_reviews_widget_v2025.js' data-entry-key='all-reviews-widget-v2025/main.js'>{% if has_legacy %}<div class='jdgm-legacy-widget-content' style='display: none;'><article class='jdgm-widget jdgm-all-reviews-widget'><style class='jdgm-temp-hiding-style'>.jdgm-all-reviews-widget{ display: none }</style>{{ shop.metafields.judgeme.all_reviews_header }}<div class='jdgm-all-reviews__body'>{% assign prefix = 'all_reviews_' %}{% for count in (0..65535) %}{% assign metafield_key = prefix | append: count %}{% assign current_metafield = shop.metafields.judgeme[metafield_key] %}{% unless current_metafield %}{% break %}{% endunless %}{{ current_metafield }}{% endfor %}</div></article></div>{% endif %}</div>{% if shop.metafields.judgeme.all_reviews_widget_v2025_data %}<script>jdgm.data ||= {}; jdgm.data.allReviewsWidgetV2025 = {{ shop.metafields.judgeme.all_reviews_widget_v2025_data }};</script>{% endif %}
         <!-- End of Judge.me code -->

      </div>
    </div>

  5. Click Save.

Customizing the Happy Customers widget

You can customize the Happy Customers widget from two places:

  • The Judge.me app (global widget settings)

  • The Shopify theme editor (page-specific behavior)

Most visual and content settings behave the same way as the Review widget, with a few store-level differences noted below.

Customizing the widget with in-app settings

From your Judge.me admin, go to Widgets > Happy Customers and click Customize.

1. Header theme

To choose a theme for the Happy Customers widget:

  1. From your Judge.me admin, go to Widgets > Happy Customers.

  2. Open the Customize tab.

  3. Open the Review section.

  4. Locate Theme.

Select one of the following options and click Save:

Default

Minimal

Sidebar

2. Title

To customize the title of the Happy Customers widget:

  1. From your Judge.me admin, go to Widgets > Happy Customers.

  2. Open the Customize tab.

  3. Open the Widget header section.

To display a title (for example, “Happy Customers”) at the top of the widget, check Show widget title.To remove the title, uncheck Show widget title.

To adjust the size of the title:

  1. Open the Header text size dropdown.

  2. Select one of the following options:

    • Small

    • Medium

    • Large

To adjust how bold the title appears:

  1. Open the Header text weight dropdown.

  2. Select one of the following options:

    • Regular

    • Bold

Click Save.

3. Average rating

To customize how the average rating appears below the Happy Customers widget title:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Open the Widget header section.

  3. Open the Average rating style dropdown.

  4. Select one of the following options:

    • "Minimal":

      • Shows the star icons, average rating, and review count.

      • Example: ★★★★★ 5.0 (3 Reviews)
        ​

    • "Compact":

      • Shows the average rating and review count.

      • Example: 5.0 3 Reviews
        ​

    • "Bold":

      • Shows the star icon and the average rating in bold, and review count.

      • Example: ★ 5.0 3 Reviews
        ​

    • "Extra bold":

      • Shows the star icon and the average rating in extra-large font size, and review count.

      • Example: 5.0 3 Reviews
        ​

    • "Stars only":

      • Shows the star icons in large font size, and the average rating and review count.

      • Example: 5.0 3 Reviews
        ​

  5. Click Save.

4. Bar chart

By default, the Happy Customers widget can display a rating breakdown in the widget header.

  • This section, also known as the histogram, rating breakdown, star distribution, or rating summary bars, shows how many reviews each star rating has received (for example, 5 stars, 4 stars, and so on), based on the reviews currently shown in the widget.

  • It also allows shoppers to filter reviews by star rating with a single click.

To customize the rating filter in the Happy Customers widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Open the Widget header section.

  3. Scroll down to Bar chart.

  4. To show the rating filter in the Happy Customers widget, click the check box next to "Show bar chart".

  5. To choose how the rating filter is displayed, open the Bar chart type dropdown and select one of the following options:

    • "Numbers": Shows each rating level (1–5) with the rating number next to a single star icon, a progress bar, and the number of reviews.
      ​

    • "Stars": Shows each rating level (1–5) as full star rows, progress bar, and the number of reviews.
      ​

  6. To choose how the progress bars in the rating filter are displayed, open the Bar chart style dropdown and select one of the following options:

    • "Standard": Shows regular, thin progress bars for each rating level.

    • "Bold": Shows thicker progress bars for a more prominent visual effect.
      ​

  7. Click Save.

5. AI store summary

The AI store review summary helps shoppers quickly understand what customers are saying about your store as a whole. This feature uses AI to analyze your store reviews and surface:

  • A short written summary of overall sentiment, and

  • Key highlights that reflect common themes in customer feedback (for example, fast shipping or helpful support).

The summary and highlights are generated automatically and update over time as you collect more store reviews.

To show the AI-generated store review summary in the Happy Customers widget:

  1. From your Judge.me admin, go to Widgets > Happy Customers.

  2. Open the Customize tab.

  3. Open the Widget header section.

  4. Scroll down to AI store review summary.

  5. Check Show AI-generated summary.

  6. (Optional) Click the checkbox next to Show summary text background to show the summary with a background highlight.

  7. Click Save.

To hide the summary, uncheck Show AI-generated summary.

6. Media gallery

The media gallery is a section displayed in the middle of the Happy Customers Widget header, showcasing customer-uploaded photos and videos. It is generated automatically from reviews that include media and updates as new photo or video reviews are collected.

To show the media gallery in the Happy Customers widget:

  1. From your Judge.me admin, go to Widgets > Happy Customers.

  2. Open the Customize tab.

  3. Open the Widget header section.

  4. Scroll down to Media gallery.

  5. Check Show media gallery.

  • To hide the media gallery, uncheck Show media gallery.

  • To display the thumbnails in a larger form, select Show expanded media gallery.

7. Search bar

To allow customers to search for reviews in the Happy Customers widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Open the Widget header section.

  3. Scroll down to find and click the check box next to "Show search bar".

  4. Click Save.
    ​

8. Review section theme

The Review section theme controls the overall layout and visual style of reviews displayed in the Happy Customers widget.

To choose a theme:

  1. From your Judge.me admin, go to Settings > Widgets > Happy Customers.

  2. Open the Customize tab.

  3. Open the Review section.

  4. Scroll down to Theme.

Select one of the following options:

Default

Cards

Align

Carousel

5. (Optional) When using the Cards theme, the widget always displays 1 column on mobile devices to ensure readability. To choose how many columns of reviews are displayed on desktop:

  • Open the Number of columns (desktop) dropdown.

  • Select one of the following options:

    • 4 columns

    • 3 columns

    • 2 columns

    • 1 column

6. Click Save.

9. Review images

To customize the style of the review images in the Happy Customers Widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Review section section.

  3. Open the Image style dropdown and select one of the following options:

    • "Thumbnails": Shows all images of each review in a small grid under that review.

    • "Highlight": Shows one main image, with an overlay (e.g., “+2”) if there are more images in the review.

  4. If you choose "Highlight" as the image style, to set the image ratio, on the Review image ratio dropdown and select one of these aspect ratios:

    • "Square"

    • "3:4": portrait

    • "4:3": landscape

  5. Click Save.

10. Verified badge style

To adjust the style of the verified badge in the Happy Customers Widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Review section section.

  3. Open the Verified badge dropdown and select one of the following options:

    • "Bold badge": Shows a filled verified badge icon.

    • "Standard badge": Shows an outlined verified badge icon.

    • "Bold text": Shows the word "Verified" inside a filled badge.

    • "Standard text": Shows the word "Verified" inside an outlined badge.

  4. Click Save.

12. Review text size and length

o set the size and length of the review text in the Happy Customers widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Review section section.

  3. Open the Review title text size dropdown and choose a font size for the review title:

    • "Small"

    • "Medium"

    • "Large

  4. Open the Review text size dropdown and choose a font size for the review content:

    • "Small"

    • "Medium"

    • "Large

  5. Open the Review text length dropdown and choose how much review text to show:

    • "Short"

    • "Medium"

    • "Long".

  6. Click Save.

13. Content display

To set the size and length of the review text in the Happy Customers widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Review section section.

  3. For Content display, to select which details to shown in each review, click the checkboxes next to the following options:

    • "Show reviewer avatar": Shows the reviewer’s profile icon.

    • "Show reviewer location": Shows the reviewer’s city and region (if available).

    • "Show reviewer country flag": Shows the reviewer’s country flag next to their name. Location is not available for reviews imported from AliExpress.

    • "Show social share buttons": Shows the sharing icons for each review. To select which platforms to include, click Click to update selection and click the checkboxes next to platforms you want:

      • "Facebook"

      • "X"

      • "Pinterest"

      • "LinkedIn"

    • "Show product variant if available": Shows the product variant details (such as size, color, or material) if available.

  4. Click Save.
    ​

14. Colors

To customize the colors of the Happy Customers widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Color and styling section.

  3. For Color palette, adjust the colors for the following elements:

    • Star and bar chart color: Sets the color of the review stars and rating filter.

    • Button color: Sets the background color of buttons (e.g. the Write a review button).

    • Button text color: Sets the color of the text inside buttons (e.g. the Write a review button).

    • Text color: Sets the color of regular text (e.g. the reviewer name and review content).

    • Lighter text color: Sets the color of secondary or less prominent text including:

      • The review count in the rating filter

      • The review date

      • The "Helpful?" label text and the thumbs-up and thumbs-down icons

      • The social share icons

  4. Click Save.

15. Corner styling

To choose how rounded the corners of the buttons in your Happy Customers widget appear:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Color and styling section.

  3. Open the Corner styling dropdown.

  4. Select one of the following options:

    • "Square": Shows sharp, right-angled corners.

    • "Soft": Shows slightly rounded corners.

    • "Rounded": Shows moderately rounded corners.

    • "Extra round": Shows fully rounded corners for a softer look.

  5. Click Save.

16. Sorting method

By default, the Happy Customers widget shows the latest reviews first.

You can change the default sorting method to better match your store’s goals—for example, showing the most helpful reviews or those with photos first.

To set your default sorting method:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Display preferences section.

  3. Open the Default sorting method dropdown.

  4. Select one of the following options:

    • "Most recent": Shows the newest reviews first

    • "Highest rating": Shows reviews with the highest ratings first

    • "Lowest rating": Shows reviews with the lowest ratings first

    • "Only pictures": Shows only reviews that include at least 1 image

    • "Pictures first": Shows reviews with images first, followed by text-only reviews

    • "Videos first": Shows reviews with videos first

    • "Most helpful": Shows reviews with the most thumbs-up (likes) from customers first

  5. Click Save.

17. Pagination

By default, the Happy Customers widget displays 5 reviews per page using pagination. This means customers can navigate through multiple pages of reviews using numbered links at the bottom of the widget.

You can customize both the pagination style and the number of reviews shown per page to better suit your store’s layout and browsing experience.

To adjust the pagination settings of the Happy Customers widget :

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Display preferences section.

  3. In the Reviews per page field, enter a number between 1 and 15 to set how many reviews are shown per page. Values outside this range will show a "Number of reviews is invalid" error.

  4. To choose how customers can browse through reviews, open the Pagination type dropdown and select one of the following options:

    • "Load more button": Shows a button at the bottom of the widget that loads more reviews when clicked.

    • "Page number": Shows numbered pages customers can click to view more reviews.

  5. Click Save.

18. Widget texts

The Widget texts settings let you customize the language and supported text labels used in the Happy Customers widget, so the wording matches your store tone and language. To customize the texts in the Happy Customers widget:

  1. From your Judge.me Admin, go to Settings > Widgets > Happy Customers.

  2. Scroll down and open the Text section.

From here, you can:

  • Select the language you’re currently editing (When using the multi-language widgets feature)

  • Customize the widget title

  • Customize the AI store review summary title

  • Edit the no reviews text shown when there are no reviews to display

If your store uses multiple languages, make sure additional languages are published in Shopify before editing them here.

Customize the Happy Customers widget with Shopify theme editor

You can control how the Happy Customers widget behaves on a specific page using the Shopify theme editor. To access these settings:

  1. Go to Online Store > Themes.

  2. Click Customize next to your active theme.

  3. Navigate to the page where the Happy Customers widget is added.

  4. Click Reviews page (paid plan) in the left-sidebar (inside the Apps block).

1. Maximum width

Use Maximum width to control how wide the widget appears on the page.

  • Drag the slider or enter a value in pixels.

  • This is useful for aligning the widget with your page layout or content width.

2. Show and filter reviews by

Use Show and filter reviews by to choose which reviews are displayed:

  • All reviews – Shows both product and store reviews

  • Product reviews – Shows product reviews only

  • Store reviews – Shows store reviews only

  • Current collection – Dynamically shows reviews for products in the current collection (Available only when the widget is added to a collection page)

3. Show all reviews on the same tab

When All reviews is selected, you can choose whether reviews are grouped or separated:

  • Enable Show all reviews on the same tab to display all reviews in one list.

  • Disable it to separate Product reviews and Store reviews into tabs.

This setting applies only when All reviews is selected.

4. Show first

Use Show first to choose which tab is shown by default:

  • Product reviews

  • Store reviews

This setting applies only when tabs are enabled.

5. If no reviews show

Use If no reviews show to control what happens when there are no reviews to display:

  • Show empty widget

  • Hide widget

Customize the Happy Customers widget with CSS

Add custom CSS in Judge.me

To add custom CSS to the Happy Customers widget:

  1. From your Judge.me admin, go to Settings > Widgets > Happy Customers.

  2. Click Customize.

  3. Scroll down to Advanced.

  4. Paste your CSS into Custom CSS.

  5. Click Save.

The Custom CSS editor is limited to 1000 characters.
​

Resources

  1. Get your free trial:

    📈 Unlock the Happy Customers widget to showcase your store’s reputation and build shopper trust with a 15-day free trial.

  2. See our latest updates:

    ➡️ Check our Unboxed page to discover newly launched features and improvements from Judge.me. See what’s new and start using the latest updates to grow your store.

Related Articles
Adding Judge.me widgets in Vintage themes
Adding the Star Rating Badge to collection pages (2.0 themes)
Star Rating Badge
Customizing the Review Widget (legacy version)
All Reviews Counter
Did this answer your question?