Expert Answers is a Question and Answer (Q&A) widget that enables customers to ask questions about a product or service directly on your site. For each question asked, you'll receive a notification in your Timeline. Any responses to questions will be shown in your widget.

Requirements

  • Only available on Growing Business and above plans.

Navigation

  • Log into your Reviews.io Dashboard

  • Navigation to Publishing

  • Select Questions and Answers.

This widget is designed for you to offer your own knowledge to your customers and as such, the questions are answered only by you, not other customers.

Embedding the Expert Answers Widget

Step 1

Add the following code to your site in the location where you wish your widget to be placed.

<div id="questions-widget" style="width:100%; max-width:1000px;"></div>

By default we have added some inline styles; however, in practice, you will likely customize these so that it fits neatly into the structure of your webpage.

Step 2

Select either Product or Company review questions from the tab and copy the appropriate code to your page.  


An example of Product review questions is below.

<script src="https://widget.reviews.co.uk/questions-answers/dist.js" type="text/javascript">
</script>

<script>
    document.addEventListener("DOMContentLoaded", function() {

        // When the page loads, we will initialise a widget on the element with an
        // id of 'questions-widget'.

        questionsWidget('questions-widget', {

            // This is your company url key
            store: 'test-account-for-videos',

            // Uncomment the attribute below and set it as the sku of the product; this will
            // tell our systems which product the questions are in regards to. If this is
            // not set then the url of the page that the widget is installed on will be used
            // to group the questions that we receive

            // group: 'SKU_PLACEHOLDER'
        });
    });
</script>

Embedding an SEO-friendly Expert Answers Widget (PHP)

Implement the following example into your server-side application. This code is provided as an example and will send a request to our server every time that it is executed; for this reason, it is important that the page is cached to prevent performance issues. The request will timeout after 5 seconds if our server is not responding.

<?php

    try {
        $ch = curl_init();

        // This is your company url key
        $url_key = 'test-account-for-videos';

        // You can provide a group for the questions that are asked using the widget.
        // This will be used to group questions together that are asked in different
        // widgets. If this value is left as null, then the url of the page that the
        // widget is displayed on will be used to group the questions. If you would
        // like to link the questions to one of your products, then set this to a
        // string containing the sku of the product.
        $group = null;

        $url = "https://widget.reviews.co.uk/questions-answers/widget?store={$url_key}";
        if (! is_null($group)) {
            $url .= "&grouping_hash={$group}";
        }
        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE);
        curl_setopt($ch,CURLOPT_TIMEOUT,5);
        $response = curl_exec($ch);
        $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
        if($httpCode == 200){
            echo $response;
        }
    } catch(Exception $e) {
        // @TODO Implement custom exception handling
    }

?>

Custom Styling the Expert Answers Widget

You can customize the styles of the Javascript widget with the following properties.

<script src="https://widget.reviews.co.uk/questions-answers/dist.js" type="text/javascript">
</script>

<script>
    document.addEventListener("DOMContentLoaded", function() {
        questionsWidget("questions-widget", {
            store: "test-account-for-videos",

            // The following properties can be added and customised to alter the colors of the
            // various widget components.
            primaryClr: "#10D577",
            neutralClr: "#EBEBEB",
            buttonClr: "#121212",
            textClr: "#2D2D2D",
            fontFamily: "'Open Sans',sans-serif"
        });
    });
</script>

To customise the SEO-friendly PHP widget, you can use the following code.

<?php

    try {
        $ch = curl_init();
        $url_key = 'test-account-for-videos';
        // The values of the following attributes can be customised to help the widget
        // fit neatly into the structure of your webpage.
        $custom_styles = array(
            'primaryClr' => '#10D577',
            'neutralClr' => '#EBEBEB',
            'buttonClr'  => '#121212',
            'textClr'    => '#2D2D2D',
            'fontFamily' => "'Open Sans',sans-serif",
        );

        $url = "https://widget.reviews.co.uk/questions-answers/widget?store={$url_key}";

        // We will now append the custom style attributes to the url.
        foreach ($custom_styles as $property => $value) {
            $url .= ("&" . urlencode($property) . '=' . urlencode($value));
        }

        curl_setopt($ch, CURLOPT_URL, $url);
        curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE);
        curl_setopt($ch,CURLOPT_TIMEOUT,5);
        $response = curl_exec($ch);
        $httpCode = curl_getinfo($ch, CURLINFO_HTTP_CODE);
        if($httpCode == 200){
            echo $response;
        }
    } catch(Exception $e) {
        // @TODO Implement custom exception handling
    }

?>

How to use the Expert Answers widget

Any questions will appear as notifications in your Timeline.  To take action, simply click on the question as you would with any other Timeline content, and from here you are able to reply to the question.

Did this answer your question?