Skip to main content

Beta - Product Trust Bar

What Is the Product Trust Bar?

We’re pleased to introduce our Product Trust Bar- the upgraded version of our Product Star widget for your product detail pages. The Product Trust Bar is fully customizable, displays your product star rating and review count, and offers you the option to also showcase your store rating and collected media.


How is the Product Trust Bar different from the previous Product Star Widget?

The Product Star Widget shows star rating and review count. The new Product Trust Bar shows star rating and review count in or outside of a container, the option to include media, an option to include a line for Store Ratings, and the ability to customize colors and layouts to fit your style.


Where to Customize

To configure the widget, go to Widgets - > Product Reviews -> Product Trust Bar & Reviews

Inside the configurator, Tabs along the top let you switch between editing:

  • Product Trust Bar — controls the star rating display

  • Product Reviews Widget — controls the full review widget on the page

The active tab is highlighted in blue, and the corresponding section of the preview is also highlighted so you know what section you’re editing.

Live Preview shows exactly how the widget will look, on desktop or mobile, as you make changes. (Note: the preview uses sample data.)


What Can Be Customized on the Product Trust Bar?

With the Product Trust Bar, you have a lot more control over how your widget looks. Here is what can be adjusted in the dashboard:

  • Enabling/Disabling the Store Ratings and Media options

  • Star color

  • Text colors (top row, bottom row, review count)

  • Icon style (filled or outlined)

  • Container shape (none, rounded rectangle, or pill shape)

  • Container color and outline style

  • Review count style (round brackets, plain text, bold, underlined)

  • Font sizes for different parts of the widget

  • Left, center, or right alignment

  • Single star vs. 5-star display

  • Media/Social Proof layout (Icon + text, Icon only, or text only)

  • Enabling/disabling the “Be the first to write a review” option

  • “Be the first to write a review” customizations:

    • Style (button, plain text, underlined link)

    • Stars included or no stars

    • Font size

    • Font color (text and button)

    • Button background color (including solid or gradient)

    • Button outline (none, solid, or gradient)

All changes show up instantly in the preview.


Example layouts

Single star, rounded rectangle container, Store Ratings enabled:

Single star, rounded rectangle container, Store Ratings enabled, Photos and Videos enabled:

5-star layout, rounded rectangle container, Store Ratings and Photo/Video disabled:

5-star layout, no container, Store Ratings enabled:

Custom colors, largest size stars and text, round pill container, Store Ratings and Photos/Videos enabled


The "Be the First to Review" Feature

If a product has no reviews yet, you can enable a "Be the first to write a review" prompt to show in place of the product review count, if you’d like one. When a shopper clicks it on the live site, it takes them directly to the review survey for that product. This helps you collect reviews on new or low-review products. This feature also has many customization options, including display style (button, underline, or plain text), size, text, and color (text, button text, and button color.)


Product Reviews Widget

The Product widget configurator also has a tab for the Product Reviews widget. This widget is the same as the current widget.

If a visitor clicks the review count on the Product Trust Bar or on the previous Product Star widget, it takes them to this widget to read all the reviews for that product:

Note: Star color, Text color, and Font size are connected between the Product Trust Bar and the Product Reviews widget. Any changes to one will affect the other.

Customization options for the Product Reviews widget are:

  • Graph style (two choices)

  • Widget content (choose if you want to display video reviews, photos, customer location, and annotations like public company responses)

  • Line or grid view

  • Alignment

  • Review date format

  • Number of Reviews to display before a visitor has to click to see more

  • Minimum number of reviews a product has to have before product reviews show

  • Default Sort order (highest to lowest, favorite reviews, newest to lowest)

  • Enable/disable Store Rating fallback (when enabled will show Store ratings until a product has the minimum number of reviews you decide)

  • Store Rating Fallback default sort order

  • Enable/disable a “Write a Review” button

  • JSON-LD Schema options (no schema, aggregate rating, product reviews only, or both ratings and reviews)

  • URL format (include www or not)

  • URL type (short or long)


Preview vs. Live Widget — Important Note

You’ll notice you can change the background color in the configurator. The background color setting in the configurator is for preview purposes only. It helps you visualize how the widget looks against your site's background, but it does not change the actual widget code or how it appears on your site.


Saving & Managing Widget Designs

  • How do I save a design?

You are prompted to Save your design after making changes:

You can update the name of the widget by clicking inside the widget box. Widget name changes save automatically.

  • Can I have more than one design?

Yes! Saved designs appear in a dropdown, and you can save multiple widgets and switch between them. You can also duplicate a design to create variations.

  • How do I delete a design?

Choose the widget you want to delete from the dropdown and click delete:

Deleted widget designs cannot be recovered. The Duplicate feature is a good way to preserve designs before making big changes.


Getting the Widget Code

If Shopper Approved is integrating for you, we will place the widget on your site. If you are integrating yourself, customize the widget until you are happy with your design. Click the blue "Get Widget Code” button in the top right corner of the page.

This opens a modal with three pieces of code:

  1. Product Star Target Code

  2. Review Widget Body Target Code

  3. Loader Script

All three need to be on your product page for the widget to work. Each one can be copied individually from the modal.


FAQ

I don't have the Product Trust Bar in my dashboard. Why am I still seeing the old Product Stars?

Please reach out to [email protected] for assistance getting this feature enabled in your dashboard.

Why isn’t my widget showing up on my site?

Make sure you’ve added all three code blocks (Product Star Target, Review Widget Body Target, and Loader Script) to your product page template. Missing even one will prevent the widget from rendering. If Shopper Approved integrated for you, reach out to [email protected].

Why aren’t my changes saving?

This is likely a caching issue. Try a hard refresh. If the problem persists, reach out to [email protected]. A cache may need to be manually cleared on our end.

Can the ‘Store Ratings” line still show when a product doesn’t have reviews?

Currently, this is not an option. However, an update is in the works, and this capability will be added soon.

Can I use the Product Trust Bar if I have Q&A?

Yes! If you have Q&A, the call-to-action widget can still go next to the Product stars if using the Product Trust Bar layout.

I think I prefer the old layout / Product Star widget better. Is it still available?

Don’t forget that you can remove the container, make the review count underlined, and disable the store rating line and the photo/video option. Doing this will make it look very similar to the old widget:

However, if you’d prefer to use the previous layout, it IS still available. Reach out to [email protected] for help:

Please note, even if using the previous Product Star Widget, your dashboard may still have the updated configurator:


If you would like to update your product page star widget to the Product Trust Bar, please reach out to [email protected].

Looking for our Store Ratings Trust Bar/ Trust Stack? Click Here

Did this answer your question?