Introduction

Integration with Yourviews is usually divided in 2 parts: Backend part (completed order's integration) and the Frontend part (what's shown to the user. usually installing our Javascript and some HTML divs)


Backend

Yourviews need to know when an order is considered complete so we can send the request review e-mail. Usually it's when the product has arrived at the customer's house. 

That integration can be made in one out of 2 possibilities:

1 - The platform sends Orders to Yourviews through our Orders API;

The documentation for this model is at: https://yourviews.freshdesk.com/solution/articles/5000774047-orders-api


2 - Yourviews will go to some Orders API of the platform and search for available orders to integrate;

The documentation for this model is at: https://yourviews.freshdesk.com/support/solutions/articles/5000702711-instalac%C3%A3o-yourviews


This integration could reuse any existant partner integration, such as those using Excel/CSV Files for instance.


Frontend

Firstly, our script needs to be installed at page's footer. Every page that shows reviews like product pages, Search pages, Department pages and so need to have that script installed. This script can be installed directly into the footer of the pages or by using Google Tag Manager.

<!-- Script Yourviews -->
<script type="text/javascript">
    (function () {
        var yvs = document.createElement("script");
        yvs.type = "text/javascript";
        yvs.async = true;
        yvs.id = "_yvsrc";
        yvs.src = "//service.yourviews.com.br/script/STORE_CODE/yvapi.js";
        var yvs_script = document.getElementsByTagName("script")[0];
        yvs_script.parentNode.insertBefore(yvs, yvs_script);
    })();
</script>
<!-- /Script Yourviews -->

IMPORTANT: You need to chage the STORE_CODE by the one Yourviews gave you (you can get it at the Yourviews Admin > Account > Store Code)


Afterwards, you can add the DIVs for each functionality of Yourviews.


a) For Star Ratings at product shelve (Home, Search, Department, etc). It's usually shown next to the product's photo, like the picture below

For that to work, you need to add the DIV below, exactly in the place you wish the star to appear

    <div class="yv-review-quickreview" value="PRODUCT_ID"></div>

IMPORTANT: It's very important to change the PRODUCT_ID for the real Id of the product, as registered in the platform


b) Star Rating anchor at products page. It's usually shown next to the product's price or title in the product page, like the picture below:

For that, just add the DIV below exactly at the point you wish the anchor to appear:

<div id="yv-review-quickreview"></div>


c) Review listing at the product's page. It's usually shown after the product description

Add the following DIV in the exactly place you like it to appear (usually after the product description):

<div id="yv-reviews"></div>


d) Questions & Answers. This is very similar to reviews. The Q&A usually appears just after the reviews, so you can add the DIV just after the review's DIV. 

 Add the following DIV for Q&A to be shown:

<div class="yv-qa"></div>


e) Create the write review hotsite. This is a landing page in which the user will be directed after clicking in the CTA on the review e-mail for writing its review. Yourviews's script will fill the page with the review form for user write to.

Although it's not required, it's recommended to be created, as helpers in store's conversion. 

You can create a hotsite with the same header and footer of the entire site, except for the middle wich should have the following code:

<div id="yv-show-form" style="min-height:300px; background-image:url(https://service.yourviews.com.br/static/images/loading.gif);background-repeat:no-repeat">
<br/><br/>Por favor aguarde...
</div>

You have to inform the page's URL to Yourviews.


Frontend - Alternative

If you don't want to use Javascript in your pages or want to have more control over the exhibition of reviews, you can use Yourviews Reviews API.

It can also be used in Apps or external websites.

You can follow instructions in the following page:

https://yourviews.freshdesk.com/support/solutions/folders/5000286367