Add product reviews and star ratings to your Shift4Shop product and category pages. This guide covers widget selection, customisation, code installation, and testing.
Step 1: Select a Review Widget
1. Log in to your WiserReview account.
2. Go to Widgets.
3. Select the widget you want to display:
- Product Review Section
- Star Rating
- Nudges
- Wall of Love
4. Click Configure.
Use the Product Review Section to show complete reviews and the Star Rating widget to display the product’s rating and review count.
Step 2: Customize the Widget
Use the widget settings to:
- Change the colors, layout, and card style.
- Filter reviews by rating, tag, or verification status.
- Add custom CSS if needed.
- Check your changes in the live preview.
When the widget is ready, click Install.
Step 3: Install the Widget in Shift4Shop
Copy the Widget Code
1. In the installation window, open the Shift4Shop tab.
2. Find the code for the page where you want to show the widget.
3. Click the copy icon to copy the code.
The product page and category page use separate widget codes. Make sure you copy the correct one.
Open the Shift4Shop Template Editor
1. Log in to your Shift4Shop admin panel.
2. Go to Settings > Design > Themes & Styles.
3. Scroll to Edit Template.
4. Click Open Template Editor.
If you cannot find a template, use the Go to folder dropdown to check template/common core theme folders.
Shift4Shop may only show templates that were previously customized.
Add the Star Rating to Product Pages
1. Open the listing_0.html product detail template.
2. Find the product name or the following block:
<div class="product-reviews">
3. Paste the WiserReview product-page star rating code in the required position below the product name.
4. Keep [catalogid] unchanged. Shift4Shop replaces it with the correct Product ID on each product page.
5. Click Save.
Open a live product or category page and confirm that the correct rating appears.