How to configure review display on a website

Evaldas MreviewsLeave a Comment

We have written in the past about review use cases. Now to be able to leverage customer reviews on your website it’s mandatory to have them added one way or another. Let’s take a look at the easiest to the most complex option of enabling review display on any website.

Using a plugin 

The simplest way to start exposing reviews is by using an existing plugin, assuming your website has one compatible with the review platform of choice. For example, Trustpilot provides a plugin for wordpress with some capabilities to display reviews. The advantage of using this approach is that you don’t need to add any javascript snippets manually, and can set the review container using drag and drop UI provided out of the box from wordpress.

Using javascript snippet 

This requires some understanding of how the javascript gonna be used by the website. It’s recommended in this case to use Google Tag Manager (GTM) to add the widget as a custom script. Then The GTM tag can be included as part of your website, using a plugin if you’re on wordpress or changing the HTML head section of your website’s source code. As an example here is a javascript code snipper from the StackTome widget:

<script id='stacktome-reviews-widget-script-5' class='stacktome-reviews-widget-script' src="https://cdn.stacktome.com/frontend/widget/production/widget.js" filter-params='{"widgetId":5,"keywords":["beautiful"],"searchInParentLocation":true,"fromDateTime":"2021-02-28T22:00:00.000Z","fromSentimentScore":0.99,"ratings":["5"],"paging":{"pageSize":6},"sorting":[{"field":"sentimentScore","direction":"desc"}],"timeout":{"timeoutMillis":1000},"reviewType":"service"}'></script>

Note that this is part of the work, the 2nd step is placing the “container: where you want your widget to be displayed on the page. Again this requires a bit of fiddling with your existing HTML and the page you changing. Again looking at our supported widget, it would be a div element like below:

<div id="stacktome-widget-5"></div>

Which can be placed on the bottom of your page after your products listings, resulting in the following:

Using review API

To use API for getting customer reviews involves changing the website’s source code. It works in the following steps:

  1. Before HTML is rendered, website calls an API with a set of parameters to get reviews
  2. API responds with a list of reviews or empty results (depending on parameters)
  3. Website then process the response and renders the HTML with the given review data

Usually, this review display approach is used when the website is custom-built or other alternatives don’t provide enough flexibility in terms of when reviews are rendered, what design can be set, SEO impact, and so on. Here is a small example of how API request could look like using StackTome API:

curl -i -X POST \
   -H "Content-Type:application/json" \
   -d \
'{
    "fromDateTime": "2021-09-01T00:00:00Z",
    "fromSentimentScore": 0.8,
    "reviewType": "service",
    "language": "en",
    "country": "uk",
    "ratings": [3,4,5],
    "paging": {"page":1,"pageSize":6,"take":6,"includeTotal":false},
    "sorting": [{"field":"sentimentScore","direction":"desc"}]
}' \
 'https://services.stacktome.com/api/reviews/v1/reviews'

Which returns something like below:

{
    "items":
    [
        {
            "createdAt": "2021-11-13T23:36:14.987Z",
            "source": "feefo",
            "domain": "shop.com",
            "fulfillmentCompany": "flamingo",
            "language": "en",
            "review": {"service":{"id":"61904beee4b066503ac93701","rating":5,"heading":"","text":"Very good website and flowers were delivered on time and looked lovely.","reply":"","sentimentScore":1,"link":"https://www.feefo.com/en_gb/reviews/"},"products":[{"id":"61904befe4b066503ac9372c","rating":5,"heading":"","text":"","reply":"","sentimentScore":-0.16228323,"link":"https://www.feefo.com/en-gb/reviews/"}]}
        }
    ],
    "meta":
    {
        "success": true,
        "statusCode": 200,
        "uuid": "f41a4e66-799d-441c-9ca9-8183d619785a",
        "paging":
        {
            "pageSize": 6,
            "page": 1,
            "pageCount": 0,
            "total": -1
        },
        "experiment": null
    }
}

Comparing review display options

Now let’s consider each approach, and answer the question of which one to use for your website? It mostly depends on your flexibility needs: 

  • Using plugin is the most easiest to setup but at the same time has most limitations, in terms of how reviews are displayed and which reviews are fetched. 
  • The javascript snippet has more steps to go through, but also has more options you can use in terms of what kind of reviews can be displayed, when widget is loaded in website and where you want the widget to be set on page.
  • API approach requires developers to install it and make it work. This is most difficult to get right, but has no limitations in terms of how reviews are displayed, allow to handle corner cases when there’s no reviews and provides full control over the review receiving process.

Additional metrics to consider when displaying reviews

  • Page speed – it’s now agreed that page load speed has a significant effect on your SEO rankings and conversions which means you don’t want a widget that slows down your website.
  • SEO compatibility – here we want to make sure that widget is rendered with semantic tags which allows google to crawl your reviews and use it on search results to improve page rank. Also it’s recommended that reviews are rendered with initial page load, for google crawler to be able to see them.

At StackTome we designed our APIs and review widget with page speed in mind, which allows us to achieve latency, below 50 ms for 99% of requests, and below 40 ms for 90% of all requests.

The widget also has the same capabilities as API giving you full flexibility of displaying any reviews with fully customizable style that can be matched to any website design. If you would like to understand if this would be fitting for your businesses feel free to sign-up for a demo – or if you would to test drive it yourself you can try a 14-day free trial.

Leave a Reply

Your email address will not be published. Required fields are marked *