The Review Tab is a standalone tab which can be displayed on any page of your website. Clicking the Review Tab will open a light-box in the centre of the screen which displays your reviews.
Your customers will be able to write a review directly from your website! This serves as a great way to collect reviews and increase engagement on your website.
Accessing the Review Tab from the Hellopeter Portal
To access the Review Tab:
Click on Widget Library.
Click on the Review Tab Widget.
Customising the Review Tab
The Review Tab is fully customisable, enabling you to match the look and feel of your website and brand. Listed below are all the elements of the Review Tab Widget you can customise.
Setting the Review Tab button position
You can choose to anchor the Review Tab on the left or right-hand side of the screen. Note - for mobile, the Review Tab will default to the bottom left of the screen.
Customise the colour of the Review Tab button and text
Click on the “Tab colour” and select the colour of the button to match the design of your website.
You can select the opacity (transparency level) you’d like the Review Tab to render by selecting one of four opacity percentages.
Click on the “Font colour” and select the colour that you’d like the button text to display as.
Important!
When selecting a colour, you have two options:
Select the desired colour scheme from the colour swatch.
You can opt to manually input or paste the RGB code of the colour.
The components of the Widget
When a customer clicks on the Review Tab, a light-box will open in the centre of the screen displaying your latest reviews. This light-box is defined as the Widget. The Widget has three components:
Header - this contains the header text your customers will see, and an option to include your Hellopeter metrics.
Body - this contains your reviews.
Footer - this contains the Write A Review button. When clicked, a modal will appear where the customer can write their review.
Customise the Widget header
You're able to include all or any of the following in the Widget header:
Metrics - if selected, this will display your Hellopeter average star rating and your total number of reviews.
Industry ranking - if selected, this will display your Hellopeter industry ranking.
Text - This is the Widget header text you’d like your customers to see (e.g. Our customers say…) You can choose this text. Please note - the character limit is 50.
Customise the Widget body
You are able to customise how you want your reviews to look and feel in order to match the design of your website. Please note - only 4 and 5-star reviews will be displayed in the Widget.
Choose your star rating colours
Average star rating - this is your Hellopeter average star rating based on all your reviews. This is displayed in the Widget header. You're able to select the star colour you want your average star rating to display as.
5-star rating - select the colour you want your 5-star reviews to display as.
4-star rating - select the colour you want your 4-star reviews to display as.
Important!
When selecting a colour, you have two options:
Select the desired colour scheme from the colour swatch.
You can opt to manually input or paste the RGB code of the colour.
Select the number of reviews to display in the Widget
You can choose to display your latest 10, 20 or 30 reviews.
Display reviewers name as anonymous
You can either choose to display the reviewers first name and the first letter of their surname (e.g. Gary T), or display as anonymous. Select the “Yes” radio button to display as anonymous or the “No” radio button to display the reviewers first name and the first letter of their surname.
Customise the Widget footer
Click on “Button colour” and select the colour of the Write a Review button to match the design of your website.
Click on the “Button Font colour” and select the colour that you’d like the text to display as.
Important!
When selecting a colour, you have two options:
Select the desired colour scheme from the colour swatch.
You can opt to manually input or paste the RGB code of the colour.
Previewing the Review Tab and Widget
The preview panel dynamically reflects the changes you make.
HTML Code
The HTML code dynamically changes based on your customisation selections. Once you're satisfied with how the Review Tab and Widget look and feel, click the “Copy Code” button and insert this code onto your website.
Please note - all settings will be lost if you navigate away from this page. Ensure that you copy the code before closing this page.
The Review Tab will appear on every page that contains the code snippet. In order to ensure that it will load on all pages, please make sure every page contains this code.