Pro Advanced Reviews

The Advanced Reviews module allows you to add social proof to your WooCommerce product pages in the form of enhanced customer reviews, similar to the ones that you can see on Amazon and other big eCommerce websites.

Merchant Pro’s Advanced Reviews module replaces WooCommerce’s basic review functionality with more engaging product reviews that include:

  • a user-friendly review popup (also referred to below as ‘modal’)
  • an eye-catching review summary
  • an option to enable reviewers to upload product photos
  • an option to add a review images carousel
  • sorting functionality
  • …and more

In the screenshot below, you can see an example of an Advanced Reviews section on a WooCommerce product page:

Frontend view of an advanced review

If a customer clicks the Write a Review button, a stylish review modal pops up on the screen where they can easily leave a product review:

An example of Merchant Pro's advanced reviews popup

For the comparison, here’s what the same product review section looks like in WooCommerce — without Merchant Pro.

As you can see below, there’s no sorting functionality, no user-friendly review popup that shows the product image and description, no eye-catching review summary, no option to upload product photos, no option to show a review images carousel, and the design is also much less engaging — in short, nothing like Amazon or other big eCommerce websites:

Screenshot of a default WooCommerce review

With Merchant Pro’s Advanced Reviews module, you can customize every aspect of your enhanced review sections so you can compete even with the biggest eCommerce marketplaces.

1. Open the Advanced Reviews Module

First, open your Merchant dashboard by clicking the Merchant menu in the left sidebar of your WordPress admin area.

Find the Build Trust section, and click the Advanced Reviews module to open its settings page:

Location of the Advanced Reviews module on the Merchant dashboard in the WordPress admin area

2. Review the Module’s Settings

On the admin page of the Advanced Reviews module, you’ll find three groups of settings:

  1. Settings – This group of settings allows you to change the content and design of your Advanced Reviews sections, including the title, description, stars, progress bars, dividers, review button, and more (see in detail in Step 3).
  2. Modal Settings – Here, you can customize the colors of the review popup that shows up on the screen when a customer clicks the Write a Review button (see in detail in Step 4).
  3. Use shortcode – This is a developer setting that enables you to use a shortcode to fine-tune the location of the Advanced Reviews sections on the WooCommerce product pages (see in detail in Step 5).

You can also see a Preview section on the right side of the admin page. This is a live preview that updates in real time as you’re modifying the settings:

Structure of the admin page of the Advanced Reviews module

3. Configure Your Advanced Reviews Sections

In the Settings section, you can customize the following options (or you can stay with the default values):

  • Title – The title of your Advanced Reviews sections on your product pages (default value: ‘What our customers are saying’).
  • Title HTML tag – The HTML tag that will be used for the titles of your Advanced Reviews sections. The available options are H1H6 (which are the six levels of headings in HTML, H1 being the page title and H6 being the lowest level; headings are present in the document outline) and div (which is a general container and not present in the document outline) (default value: H2).
  • Hide title – This toggle lets you hide the title of the Advanced Reviews sections.
  • Description – Here, you can add a description that will show up below the title (the field is blank by default).
  • Title and description alignment – These three radio buttons allow you to change the alignment of the title and description of the Advanced Reviews sections. The available options are Left, Center, and Right.
  • Default reviews sorting – Here, you can configure how your reviews will be sorted by default. The available options are Newest, Oldest, Top rated, Low rated, and Photo first. Note that your customers can also change the sorting criteria by using a dropdown that shows up inside the Advanced Reviews sections.
  • Pagination type – Here, you can choose from two pagination types for your Advanced Reviews sections. The available options are Default (this will show page numbers like 1, 2, 3…) and Load more button.
  • Review options – This option lets you choose from three types of reviews: Image and text (your customers can both enter a text review and upload images), Image only (your customers can only upload images but can’t add text), and Text only (your customers can only add text but can’t upload images).
  • Photos upload limit – Here, you can use a range slider to set how many images your customers can add to a review (default value: 6).
  • Review images carousel – Here, you can toggle on an image carousel that shows the first image from each review that your customers have left for the respective product. When the option is toggled on, you also get access to the following settings:
    • Total images – This is the number of images that Merchant Pro shows inside the carousel (default value: 12).
    • Columns – This is the number of images that Merchant Pro shows by slide (default value: 3).
  • Carousel Title – Here, you can change the title of the review images carousel (default value: ‘Customer Images’).
  • Hook order – This option lets you define the position of the Advanced Reviews sections on the WooCommerce product pages. Lower values display the section closer to the top of the page while higher values display it closer to the bottom (default value: 10 — this is a fairly low value, so it will show the Advanced Reviews section right below the main product section added by WooCommerce).
  • Title color – Here, you can customize the text color of the title of the Advanced Reviews sections with the help of a user-friendly color picker (default value: #212121).
  • Description color – This is the text color of the description that appears below the title (default value: #777).
  • Stars color – Here, you can change the main color of the five rating stars inside the Advanced Reviews sections (default value: #FFA441).
  • Stars background color – This is the background color of the five rating stars (default value: #757575).
  • Progress bar color – This is the main color of the five progress bars that show up in the star rating summary (#212121).
  • Progress bar background color – This is the background color of the five progress bars (default value: #F5F5F5).
  • Dividers color – Here, you can configure the color of the dividers that Merchant Pro shows between the individual reviews (default value: #e9e9e9).
  • Button color – This is the default text color of the ‘Write a Review’ button inside your Advanced Reviews sections (default value: #FFF).
  • Button color (hover) – This is the text color of the ‘Write a Review’ button when a customer moves the cursor over it (default value: #FFF).
  • Button background color – This is the default background color of the ‘Write a Review’ button inside your Advanced Reviews sections (default value: #212121).
  • Button background color (hover) – This is the background color of the ‘Write a Review’ button when a customer moves the cursor over it (default value: #757575).
Settings section of the Advanced Reviews module of Merchant Pro

If you’ve changed any of the default values, click the Save button that appears in the top-right corner of the page.

4. Customize Your Advanced Reviews Modals

You can find the Modal Settings section below the Settings section on the module’s admin page. These options allow you to change the design of your Advanced Reviews modals, respectively:

  • Close icon color – Here, you can change the default color of the close icon of your Advanced Reviews modals (default value: #757575).
  • Close icon color (hover) – This is the color of the close icon when a customer moves the cursor over it (default value: #212121).
  • Title color – This is the text color of the title of your Advanced Reviews modals (default value: #212121).
  • Description color – This is the text color of the description that Merchant Pro shows below the title inside your Advanced Reviews modals (default value: #777).
  • Textarea color – Here, you can customize the color of the text that shows up inside the ‘Your review’ text box while a customer is typing their review (default value: #777).
  • Textarea background color – This is the background color of the ‘Your review’ text box (default value: #FFF).
  • Modal background color – This is the background color of your Advanced Reviews modals (default value: #F5F5F5).
Modal Settings of the Advanced Reviews module

If you made any changes, click the Save button at the top of the page.

5. Activate the Advanced Reviews Shortcode (for Developers)

The Advanced Reviews module is also available as a shortcode.

Note that activating the shortcode automatically deactivates the ‘Hook order’ option, so Merchant Pro won’t display the Advanced Reviews section on the frontend until you add the shortcode manually to your product pages. This is a security measure to prevent duplicate content when the shortcode is used.

The shortcode is [merchant_module_advanced_reviews].

If you want to use it, toggle the Use shortcode option on and save the settings:

Use shortcode option of the Advanced Reviews module

6. Enable the Advanced Reviews Module

To activate the module, click the Enable button at the top of the page:

Location of the Enable button on the Advanced Reviews module's Settings page

Troubleshooting Advice

Note that the Advanced Reviews module only shows up on a product page if WooCommerce’s Enable reviews option is toggled on for that product.

This option is enabled by default for each product — but we recommend that you check it if an Advanced Reviews section doesn’t show up on a product page after the module has been activated.

You can find the Enable reviews option by opening the product’s admin page from the Products > All Products menu, scrolling down to the Product data section, and clicking the Advanced tab:

Location of the Enable reivews checkbox of a WooCommerce product page, annotated screenshot