Overview
The Carousel Widget is a fully customisable SEO friendly Widget that displays your latest 4 and 5-star reviews. If you’ve connected your Google My Business and/or Facebook accounts to Hellopeter, you have the option to display your Google Local and/or Facebook ratings and reviews.
This Widget is built in JavaScript which means Google is able to crawl and index your reviews. Installing this Widget helps improve your Google rankings and reassures potential customers that purchasing from your business is a great choice to make.
Important!
You need a minimum of five positive reviews (4 & 5 stars) to use this Widget. In order to display ratings and reviews from Google and/or Facebook, you need a minimum of one review from the respective channel.
Accessing the Carousel Widget from the Hellopeter Portal
Log in to your Hellopeter Portal.
Click Widget Library.
Click Carousel Widget.
Widget Dimensions
The Carousel Widget on desktop display is available in 3 sizes:
- 320 pixels
- 700 pixels
- 940 pixels
Our mobile Carousel Widget is available in one size - 320 pixels.
Customising the Carousel Widget
The Widget is fully customisable, enabling you to match the look and feel of your website and brand. Listed below are all the elements of the Carousel Widget you can customise.
Customise the Widget Header
You're able to choose to display either your metrics or text in the Widget header:
Metrics - if selected, this will display your Hellopeter average star rating and your total number of reviews. You can also choose to include your Hellopeter industry ranking
Text - If selected, the Widget header text will display the following copy “Our customers say…”
Customise the Widget body
The Carousel Widget has two display options:
Original (default).
Transparent.
If you select the Original (default) option, you'll only be able to customise the star rating colour. All other elements (the font/border colours and Hellopeter logo) will display the default settings.
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.
If you select the Transparent option, you will be able to customise the following elements:
The Widget background colour.
The Widget font and border colour.
A logo that matches the Widget and background.
The star rating colour.
Selecting your Widget background colour
The right-hand side of your screen is a preview panel that dynamically reflects the changes you make. The preview panel allows you to see how the Carousel Widget will display on your website. You're also able to switch between desktop and mobile previews.
When selecting the transparent Widget option, a circle will appear next to the desktop icon in the header of the preview panel.
Click on the circle and select a background colour to match the look and feel of your website. This will allow you to see how the Widget will display on a background that matches your brand and website.
The colour of the preview panel and Carousel Widget will change to your selected colour.
Choose your font and border colours
Click on the font and border colour to select a suitable colour
Choose your Hellopeter logo colour
Select the Hellopeter logo that’s most suited to your look and feel.
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.
HTML Code
The HTML code dynamically changes based on your customisation selections. Once you’re satisfied with the look and feel of the Widget, click the “Copy Code” button and insert this code onto your website.
For more information visit our support to get advice and answers, or reach out to the Hellopeter team via our live chat.