You are on page 1of 27

Generic Installation Guide

Guide

V. 2.0.

Yotpo Ltd.
1

Generic Installation Guide, Yotpo

www.yotpo.com

Table of Contents

I.

II.

Introduction
a. Overview
b. The Review Life Cycle
The Basics
a. The Yotpo Environment
b. YQuery JavaScript Library
c. Reviews Widget

III.

Mail After Purchase

IV.

Conversion Tracking

V.

VI.

Display Options
a. Reviews Tab
b. Star Rating
c. Embedded Widget
d. Badge
SEO Optimization
a. Minisite
b. Star Rating (Bottom Line) Feed via API
c. Inline SEO experience

2
Generic Installation Guide, Yotpo

I.

Overview
a. Introduction

Yotpo provides a feature-rich solution for product and site reviews. The
sophisticated self-learning optimization per-site algorithms give Yotpo users the
highest open rate for Mail After Purchase emails (38%) and enable automated
social media integration, while also significantly boosts upsells. Furthermore,
Yotpos reviewer verification and Social Q&A features expand ongoing customer
contact and strengthen trust and communication between past buyers and new
prospects, while enabling customers to maintain control through effective
moderation. Yotpo collects more reviews and produces more customer
conversions than other comparable platforms.
This document describes the installation steps required to configure Yotpos
customized solutions within your website and online store.

b. The Review Life Cycle


Once deployed, Yotpo will manage the end-to-end handling of customer reviews
for your site, according to the following stages:
1. Your ecommerce platform or website will provide Yotpo with transaction
details of all purchases. No payment details (such as credit cards) are
included.
2. Following each purchase or transaction, Yotpo will send follow-up emails
to the buyer requesting product and/or site reviews. The timing and
content of these emails is customized and designed for optimal open and
response rates. Reviewers can also initiate site and product reviews
directly on the website.
3. Site owners will moderate reviews received and decide to publish each
review received on the website and/or in a social medium.
4. Each review received will be classified by its level of credibility, marking
whether it came from a Verified Buyer (a confirmed purchaser) or Verified
Reviewer (an authenticated person, by email address).These statuses will
appear as badges with the reviews. If a review is submitted on the
website and the email address was not verified the reviewer will appear
as an anonymous reviewer and will not receive a Verified badge.
5. Once published on the website, the web page will include various
customizable widgets for displaying reviews and sorting. The widgets will
retrieve their content from Yotpo.
6. Reviews will also be published to Yotpo Minisites which link review content
to the specified product pages for SEO purposes. Leading search engines
3
Generic Installation Guide, Yotpo

such as Google thrive from the changing content, thus driving more SEO
traffic to your site.
7. Additionally, site owners can distribute review content to Facebook and to
Twitter for further exposure and upsell.

4
Generic Installation Guide, Yotpo

II.

The Basics
a. The Yotpo Environment
When deploying Yotpos review solutions on your online store a Yotpo account
needs to be created. Various account and plugin options are supported
according to individual needs.
Yotpo has both users and accounts. Each user has at least one account and can
also have multiple accounts. An account cannot have multiple users.
Users can open an account via an email address and a secure password from
within the website (www.yotpo.com). Once signed up, the Yotpo Admin can be
accessed using the same email address and password from within the Yotpo
website. The Yotpo Admin contains all Yotpo settings, functionalities and
appropriate code snippets of the various on-site options and features.
Once an account is created the system automatically generates an App Key and
App Secret. The App Key and App Secret are unique identifiers of an account,
are valid throughout the lifecycle of the account and can be found in the Yotpo
Admin under Settings > Store Settings.

Yotpos API can be used in conjunction with the web based Yotpo account and
interface. The Yotpo API calls are restricted to authenticated users only and
therefore require an utoken. The utoken can be retrieved based on the App Key
and App Secret and is valid for 48 hours. It is recommended to use the utoken
for various calls within 48 hours (instead of creating a new utoken for every
call). The API call below describes how to retrieve an utoken:
Method: POST
URL: https://api.yotpo.com/oauth/token
Content-Type: JSON
Mandatory parameters:
client_id the account App Key
client_secret the account App Secret
5
Generic Installation Guide, Yotpo

grant_type "client_credentials"
Please note the client credentials value is static and does not require a
dynamic value.
Request example:
{
"client_id": "a3lmMnC3u4SNmz0ZcHf3lODeIYM9LEQwtTWXRdDP",
"client_secret": "NumuadvlCGOTwnCCvY5BRAhGib1LTCFptYxfvebm",
"grant_type": "client_credentials"
}

Response example:
{
"access_token" : "DUGKea0thVDL2muWzMAd7mYlkni46cJWhiX9tGTF",
"token_type" : "bearer"
}

For more information regarding our API interface please visit our API Library at
http://docs.yotpoapi.apiary.io.

b. Widget.js
The first step to install the Yotpo extension onto your website is to deploy a
JavaScript library called widget.js onto your pages. The purpose of the widget.js
is to ensure the loading and correct behavior of the various reviews display
options within your website. Those display options include the Reviews Widget,
Star Rating, Reviews Tab, Embedded Widget, etc. Further explanation and
deployment methods of those display option will be discussed in chapter V of
this guide.
To ensure the JavaScript will load without affecting the page load time, the
Yotpo system is asynchronously loaded to your website. Widget.js is loaded
from staticw2.yotpo.com, which works on top of the Akamai CDN for enhanced
performance.
<script type="text/javascript">
(function e(){var
e=document.createElement("script");e.type="text/javascript",e.async=tru
e,e.src="//staticw2.yotpo.com/<APP_KEY>/widget.js";var
t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(
e,t)})();
</script>

6
Generic Installation Guide, Yotpo

The recommended placement of the widget.js is within the <head> section of


all your pages. The <APP_KEY> placeholder needs to be replaced with the App
Key from within the Yotpo Admin or taken from the API user creation response.

c. Reviews Widget
The Reviews Widget contains all written product reviews, it is located on the
appropriate product pages and displays the matching product reviews of the
visited product page. The Widget does not only contain all reviews but also
enables customers to submit a product review from within the website.
To add the Reviews Widget to your website the code snippet below should be
added to your product pages:
<div class="yotpo yotpo-main-widget"
data-product-id="<ID of the product >"
data-name="<Product Title >"
data-url="<The URL to the page where the product is URL escaped>"
data-image-url="<The product image URL. URL escaped>"
data-description="<Product description >"
</div>

Each data element needs to be substituted with the appropriate values of your
website and product attributes.
Furthermore Yotpo offers two options to load the Reviews Widget:
Immediate Update: The Immediate Update option conducts all changes as
soon as they were performed. Those changes can include look & feel
modification of the Reviews Widget, a submitted review or an unpublished
review.
Better Performance: The Better Performance option does not load look & feel
changes, new submitted reviews or freshly unpublished reviews immediately
but ensures the Reviews Widget and all Yotpo display methods load faster on
the page than the Immediate Update - option. The expected time frame of
those actions to be seen on the website is approximately an hour.
It is recommended to start with the Immediate Update option upon first
configuration to test the Reviews Widget design and functionality and then
transition to the Better Performance option.
The configuration of the Reviews Widget loading options can be chosen in the
Yotpo account under Tools > On-site > New Reviews Widget > Widget Settings
> General Settings.

7
Generic Installation Guide, Yotpo

In addition to the basic widget content as set above the following data elements
are optional and can be customized:
Language: The default language of the Yotpo account is English and is set on
the account level, from within the Yotpo Admin. The language can be
changed in your Yotpo account under Tools > Collect Reviews > Email and
General Settings > General Settings > select the appropriate language >
click Save Changes. The Reviews Widget's language will be adjusted
according to the language set in the Email settings. The RTL alignment is
automatically inherited from the selected language.
Widget Colors: The Reviews Widget colors follow a palette of colors and not
individual colors of each element. Once a primary color is chosen all
elements (e.g. base colors, buttons, text, etc.) adjust themselves
accordingly. The primary color can be determined in the Yotpo account under
Tools > On-site > New Reviews Widget > Look & Feel -tab > select the
appropriate Primary Color > click Save Changes. It is also possible to set the
widget background to transparent instead of a chosen color.
Stars Images: The stars are yellow by default. The color of the stars can be
changed in the Yotpo account under Tools > On-site > New Reviews Widget
> Look & Feel -tab > select the appropriate Stars Color > click Save
Changes.
It is also possible to use complete customized icons for the reviews rating
instead of the default stars icons. The stars have 3 versions: full, half-full
and empty. When customizing the icons all 3 states need to be substituted
with new images. The customized icons can be uploaded from within the
Yotpo account under Tools > On-site > New Reviews Widget > Advanced
Customization > click on the full, half-full and empty images to select the
appropriate image > click Save Changes.
Reviewer Avatar Image: The Reviewer Avatar displays the first letter of the
reviewers' name and will be displayed next to every review, unless the
reviewer links to his/ her social network. The avatar image can be
customized by uploading an image of your choice in the Yotpo account under
Tools > On-site > New Reviews Widget > Advanced Customization > click on
the Profile Picture image to select the appropriate image > click Save
Changes.
Widget Settings: The Reviews Widget can be presented in a Read-Only mode
or enable visitors to submit reviews via Reviews Widget online. The structure
of the Reviews Widget can be customized to display 5, 10, 15, 20 or 30
reviews per page. Furthermore the date format next to each review can
follow the DD/MM/YY or MM/DD/YY format. All widget settings can be
configured in the Yotpo Admin under Tools > On-site > New Reviews Widget

8
Generic Installation Guide, Yotpo

> Widget Settings > choose the appropriate preferences > click Save
Changes.
General Display: The Reviews Widget design can be fully customized with
CSS. The widget's CSS can be accessed in the Yotpo account under Tools >
On-site > New Reviews Widget > CSS Editor > click Enable to override the
basic look & feel and access the CSS Editor > conduct the appropriate
modifications > click Save Changes.

9
Generic Installation Guide, Yotpo

III.

Mail After Purchase

A Mail After Purchase - email is an automatic email that is sent to your


customers, at a set time after their purchase. This email encourages them to
leave a review for your products. Over 90% of product reviews are usually
made through this email because customers are able to leave reviews within the
emails themselves without leaving the native email client (The exception of
certain email clients may apply).
When a customer orders more than one item, a Mail After Purchase email will
be sent for each product, with a delay of five days between each email. By
default only up to 3 emails per order will be sent, even if a customer bought
more than 3 products. In those instances emails will be sent out for the 3 most
expensive products bought. It is also possible to customize and configure
different email delivery options for multiple orders per transaction.
This section describes the API integration of the Mail After Purchase feature and
particularly how to provide Yotpos servers with the purchases made within your
online store. Those purchases, in conjunction with the reminder date set in the
Yotpo Admin, serve as trigger point for the Mail After Purchase functionality.
Please contact your Optimization Expert for further assistance on how to
customize the Mail After Purchase email templates or how to determine the
days set to send the Mail After Purchase emails.
To send your online stores purchases to Yotpo an integration with Yotpos API is
required. Every valid and existing purchase should be pushed to the Yotpo
system. The recommended status to be pushed to Yotpo is shipped or
completed.
The 2 calls described below are required for pinging on a purchase which took
place. In cases whereby an utoken was already created within the last 48 hours,
step 1 can be omitted.
1. Retrieve an utoken:
Method: POST
URL: https://api.yotpo.com/oauth/token
Content-Type: JSON
Mandatory parameters:
client_id the accountApp Key
client_secret the account App Secret
grant_type "client_credentials"

10
Generic Installation Guide, Yotpo

Please note the client credentials value is static and does not require a
dynamic value.
Request example:
{
"client_id": "a3lmMnC3u4SNmz0ZcHf3lODeIYM9LEQwtTWXRdDP",
"client_secret": "NumuadvlCGOTwnCCvY5BRAhGib1LTCFptYxfvebm",
"grant_type": "client_credentials"
}

Response example:
{
"access_token" : "DUGKea0thVDL2muWzMAd7mYlkni46cJWhiX9tGTF",
"token_type" : "bearer"
}

2. Create Purchases:
Method: POST
URL: https://api.yotpo.com/apps/{app_key}/purchases/mass_create
Content-Type: JSON
Mandatory parameters:
app_key accounts App Key
utoken access token retrieved using the previous request
platform general
orders list of orders
orderemail customer email
customer_name customer name
order_id unique store order id
order_date date of order
currency_iso order currency
products hash of products, with product ids as their hash keys

11
Generic Installation Guide, Yotpo

product
url url of the product
name products name
image products image url
description - products description
price products price
Please note the platform value is static and does not require a dynamic
value.
Request example:
{
"utoken": "XVUYvqaRLPtjfuj1OyNbyqw1cv0R0f76g4PadwmR",
"platform": "general",
"orders":[
{
"email": "client@example.com",
"customer_name": "bob",
"order_id": "1121",
"order_date": "2013-05-01",
"currency_iso": "USD",
"products": {
"11121": {
"url": "http://example_product_url1.com",
"name": "product1",
"image": "http://example_product_image_url1.com",
"description": "this is the description of a
product",
"price": "100"
},
"11133": {
"url": "http://example_product_url2.com",

12
Generic Installation Guide, Yotpo

"name": "product2",
"image": "http://example_product_image_url2.com",
"description": "this is another description of a
different product",
"price": "200"
}
}
},
{
"email": "client1@example.com",
"customer_name": "bob1",
"order_id": "1122",
"products": {
"11121": {
"url": "http://example_product_url1.com",
"name": "product1",
"image": "http://example_product_image_url1.com",
"description": "this is the description of a
product"
},
"11133": {
"url": "http://example_product_url2.com",
"name": "product2",
"image": "http://example_product_image_url2.com",
"description": "this is another description of a
different product"
}
}
}
]
}

13
Generic Installation Guide, Yotpo

Response example:
{
"code" : 200,
"message" : "OK"
}

It is also possible to configure a call for a one time/ full list of all orders. The
purpose of this call is to test and confirm the status of the purchases within the
Yotpo system. This is one of our recommended best practices for testing that
API calls are correct. Since this process is asynchronous, it is best to wait a few
minutes before checking if the purchases arrived.
Method: GET
URL:
https://api.yotpo.com/apps/{app_key}/purchases?utoken={utoken}&since_id=
{since_id}&since_date={since_date}&page={page}&count={count}
Content-Type: JSON
Mandatory parameters:
app_key stores app_key
utoken access token retrieved using the oauth/token request
Optional parameters:
since_id starting order id to return orders since
count number of results per page
page page number
Response example:
"status": {
"code": 200,
"message": "OK"
},
"response": {
"purchases": [
{
"id": 80,
"user_email": "test@use.com",

14
Generic Installation Guide, Yotpo

"user_name": "lamba",
"product_sku": "123",
"order_id": "100",
"product_name": "ttt",
"product_url": "http://www.google.com",
"order_date": "2013-05-06T16:45:40Z",
"product_description": "lalalala",
"product_image":
"http://www.google.com/images/srpr/logo4w.png",
"delivery_date": "2013-05-19T21:00:00Z",
"created_at": "2013-05-20T16:45:40Z"
},
{
"id": 980,
"user_email": "test@use.com",
"user_name": "lamba",
"product_sku": "123",
"order_id": "1000",
"product_name": "ttt",
"product_url": "http://www.google.com",
"order_date": "2013-05-06T16:46:04Z",
"product_description": "lalalala",
"product_image":
"http://www.google.com/images/srpr/logo4w.png",
"delivery_date": "2013-05-19T21:00:00Z",
"created_at": "2013-05-20T16:46:04Z"
}
],
"total_purchases": 1001
}

15
Generic Installation Guide, Yotpo

For code samples and a mockup of the API server please refer to Yotpos API
library at http://docs.yotpoapi.apiary.io/#mailafterpurchase.

16
Generic Installation Guide, Yotpo

IV.

Conversion Tracking

Yotpo helps you leverage your reviews to drive traffic to your store, and
increase your sales. The conversion tracking code enables you to measure those
gains. Following each successful checkout submission, Yotpo validates if the
visit and sale was generated by Yotpo or self-served.
The Conversion Tracking code below should be loaded at the completion of each
purchase, in the confirmation page.
<img
src="https://api.yotpo.com/conversion_tracking.gif?order_amount=######
ORDER_AMOUNT#####&order_id=######ORDER_ID######&order_currency=######C
URRENCY######&app_key=###YOUR_APPKEY#####" width="1" height="1">

The conversion code tracking is deployed within an <img> tag on your checkout
Thank You page, regardless of a specific location within the code.
Please make sure to substitute ###YOUR_APPKEY#####, ORDER_AMOUNT,
ORDER_ID, and CURRENCY with the appropriate values for each purchase.

17
Generic Installation Guide, Yotpo

V.

Display Options

Displaying and collecting product reviews is one of the best ways to increase
your visitor-to-customer conversion rate. In this chapter we will discuss a
number of tools Yotpo provides to display the various review types on your
website.
All tools described below are based on the Widget.js and will only appear on
your website if the Widget.js and the codes listed below are deployed
appropriately.

i.

Reviews Tab
The Reviews Tab helps showcase all reviews in one dedicated place. Reviews
will appear as a small tab on the bottom or on the side of your pages.
The Reviews Tab can include product reviews and/or site reviews, either in the
form of aggregated reviews in the Reviews Tab or in form of a dedicated
reviews page. The loading of the Reviews Tab is controlled from within the
Widget.js. Therefore it is possible to enable/disable and customize the look &
feel of the Reviews Tab from within the web based Yotpo Admin under Tools >
On-site > Reviews Tab > tick the checkbox next to Reviews Tab enabled >
then click Save changes.
The following settings can be customized:
Tabs to show: Display site reviews only, product reviews only or both.
Default Reviews Tab: The tab which appears first when opening the Reviews
Tab.
Reviews Tab header text: The text which appears in the header when
opening the Reviews Tab. The following text will appear as default within the
header of the Reviews Tab if no other text will be entered: THESE ARE REAL
REVIEWS FROM REAL SHOPPERS.
Position: The relative location of the Reviews Tab on the website. The 3
options are centralized and are either on the left hand side of the screen, the
right hand side of the screen or at the bottom of the screen.
Button Text: The text that appears on the actual Reviews Tab. The default
title is Reviews.
Button color: The background color of the Reviews Tab.
Text color: The color of the text of the Reviews Tab.
Button opacity: The degree of transparency of the chosen color of the
Reviews Tab. The available degrees are 10%, 20%, 50%, 70% and 100%.

18
Generic Installation Guide, Yotpo

To showcase your reviews on a dedicated page on your website, the code below
needs to be inserted in the source code of the page where you want to show the
reviews.
<script type="text/javascript"> var yotpo_app_key = "="APP_KEY"";
(function(){function e(){var
e=document.createElement("script");e.type="text/javascript",e.async=!0
, e.src="//staticwww.yotpo.com/js/yQuery.js";var
t=document.getElementsByTagName("script")[0];
t.parentNode.insertBefore(e,t)}window.attachEvent?window.attachEvent("
onload",e):window.addEventListener("load",e,!1)})(); </script>
<div id='yotpo-testimonials-custom-tab'></div>

Please make sure to substitute "APP_KEY" with your accounts App Key.

ii.

Star Rating
The Star Rating adds an aggregated star rating for your products. The total
amount of reviews written will appear next to the aggregated star rating, but
only next to products that have reviews.
Clicking the Star Rating will direct the customer to all the reviews of this specific
product.
To install the Star Rating, the following code snippet should be added to your
product and/ or category pages:
<div class="yotpo bottomLine"
data-appkey="APP_KEY"
data-domain="Domain of the shop"
data-product-id="Id of the product"
data-product-models="Products model information"
data-name="Product Title"
data-url="The url to the page where the product is url escaped"
data-image-url="The product image url. Url escaped"
data-description="product description"
data-bread-crumbs="Product categories"></div>

Each data element needs to be substituted with the appropriate values of your
website and product attributes.

19
Generic Installation Guide, Yotpo

iii.

Embedded Widget
Yotpo's Embedded Widget enables you to show off your reviews and popular
products on your site and drive traffic to your product pages.
The logic of the Embedded Widget can be chosen to display top rated products
or the most recent product reviews. Further attributes, e.g. color, font, etc. can
be customized from within the Yotpo Admin under Tools > On-site > Embedded
Widget. The following settings can be customized:
Logic: The type of contents to be displayed within the Embedded Widget.
The Top Products - logic will display dynamically changing reviews based on
the highest average rating of product reviews. The Recent Reviews - logic
will display dynamically changing and latest product reviews and site
reviews.
Layout: The design and included displayed elements of the Embedded
Widget. The layout options are dependent on the chosen logic.
The Top Products type has 2 layout options:
Basic Layout which includes the product title and the average rating
of the listed product.
Photo Layout which includes the product image, product title and
average rating of the listed product.
Each listed item is clickable and directs to the matching product page.
The Recent Reviews type has 3 layout options:
Basic Layout which includes product title and star rating of the listed
product for product reviews, as well as website name and star rating
for site reviews.
Photo Layout which includes product image, product title and star
rating of the listed product for the product reviews, as well as site
logo, website name and star rating of the site reviews.
Reviews Layout which includes the product title for product reviews
or the homepage URL for site reviews, date of review submission,
reviews header, submitted star rating and the review itself.
Each listed review is clickable. Product reviews lead to the matching product
page and site reviews lead to the websites homepage.
Widget Width: The percentage of the width of the Embedded Widget to be
displayed on the page.
Number of items: The amount of reviews to display in the Embedded Widget.
Header Text: The text which appears in the header of the Embedded Widget.
The following text will appear as default within the header if no other text
will be entered: Recent Reviews.

20
Generic Installation Guide, Yotpo

Header Background: The color of the background of the Embedded Widgets


header.
Body Background: The color of the background of the Embedded Widgets
body.
Transparency: The option to set the background of the Embedded Widgets
body to transparent.
Header Font Size: The size of the font within the Embedded Widgets header.
Header Font Color: The color of the font within the Embedded Widgets
header.
Based on those selections the code for the Embedded Widget can be generated
from within the Yotpo Admin. Once the code is created, changes in the
customization settings will not affect the deployed Embedded Widget.
A sample code can be found below:
<div id="y-embedded-widget" class="yotpo embedded-widget"
data-appkey="APP_KEY"
data-product-id="top_rated_products"
data-layout="basic"
data-width="100"
data-reviews="5"
data-header-text="Top Rated Products"
data-header-background-color="919191"
data-body-background-color="FFFFFF"
data-font-size="18"
data-font-color="FFFFFF">&nbsp;</div>

Each data element needs to be substituted with the appropriate values of your
website and product attributes.

iv.

Badge
With Yotpo Badges, customers can show off the total amount of collected
reviews as well as the average review score. When a visitor clicks on the badge,
the Reviews Tab will open up on the screen and the visitor can view all
published reviews.
Its recommended to embed the following code into the footer of the website
and within all pages.
<div id="y-badges" class="yotpo badge badge-init">&nbsp;</div>

21
Generic Installation Guide, Yotpo

VI.

SEO Optimization

Yotpo's code and review content is loaded asynchronously after your webpages
(or product pages) have finished loading, using AJAX. Product reviews are
displayed in the Widget, which is written in JavaScript. While this ensures the
product pages will load in the fastest way possible, it also makes the reviews
content not crawlable by search engines. This chapter outlines 2 different setup
options to have your reviews content indexed by search engines and therefore
also searchable, as well as utilize the Star Rating content.

a. Minisite
The Yotpo Minisite ensures the review content will be searchable in all search
engines. The Minisite is a full static webpage containing all the data which was
generated in the system via the Widget and does not contain the JavaScript
elements of the Widget code. Combining the Minisite and SEO techniques of
data structuring re-direct visitors to the original product page within the website
and result in an increase of the search engine ranking.
The canonical format allows to publicly specify the preferred version of a URL
and provides you with more control over the URL returned in search results.
Setting the canonical URL to your website enables to attribute the data to the
original site which is supported by Google. It also helps to ensure properties
such as link popularity are consolidated to your preferred version.
To set up the Minisite, a new CNAME needs be created on your website which
directs to Yotpo at [yoursitename].yotpo.me. The CNAME can be requested
from your domain provider. Once you have created a CNAME, and directed it to
your unique .yotpo.me address, the following values need to be filled out within
the Yotpo Admin under Tools > SEO > SEO Tricks.
Subdomain: The desired unique name for the static reviews site (e.g.
YourSiteName).
Cname: The name of the page in your site which will use the Minisite (e.g.
reviews.YourSiteName.com).
Minisite: The desired name for the static reviews page (e.g. My Reviews
Page).
Parent Site: The main page of the website (e.g. YourSiteName.com).
The check box next to Activate SEO Minisite for my reviews! should be
ticked to activate the Minisite and afterwards the configuration needs to be
saved by clicking Save changes.
Please note it can take up to 48 hours for your domain to completely update the
data and display the reviews in the search engine results.
22
Generic Installation Guide, Yotpo

The Minisite can be tested in a browser window by adding the following string
/sitemap.xml to the address of your CNAME and navigating to the yourcname.yoursite.com/sitemap.xml page.
The Minisite looks like a collection of links. Each link corresponds to a product
and its reviews. Each time a new review will be submitted, another link will be
added to the Minisite automatically. The minisite will not be seen by any of your
customers. It is used for SEO purposes only.

The links from within the Minisite can be accessed to see the review itself.
Those pages including the reviews are used for search engines to index the user
generated content which was created on your website through Yotpo, and to
raise the SEO ranking of your products.
It is possible to edit the basic layout of the Minisites review pages. Those
styling settings include the color of the top bar, the background color and the
uploading of your own logo. The styling settings can be customized from within
the Yotpo Admin under SEO > SEO Tricks > scroll down to the Styling Settings
section > click Save changes once you finalized the customization.
To ensure correct crawling by Google and/ or Bing and avoid potential errors
with the review indexing, its recommended to use Google Webmaster Tools at
https://www.google.com/webmasters/tools/home or Bing Webmaster Tools at
http://www.bing.com/toolbox/webmaster by verifying the ownership of the
Minisite. The steps below describe how to verify the Minisite within the
Webmaster Tools and how to re-connect within Yotpo.
Sign into your Webmaster Tools account.
Click Add a site.
For Googles Webmaster Tools: Add the URL of the Minisite into the text box
and click Continue. The Minisite URL can be found in the Yotpo Admin
under Tools > SEO > SEO tricks > scroll to the Cname text box.
For Bings Webmaster Tools: The Minisite URL should appear automatically.
Click Add.
For Googles Webmaster Tools: A code string will be displayed. It is
recommended to use the HTML format of the code and copy the entire Meta
Tag.
For Bings Webmaster Tools: 3 options of code strings will appear. Copy the
entire <Meta> tag in HTML format which appears under Option 2.
Paste the Meta Tag into the Yotpo Admin under Tools > SEO > SEO Tricks >
Minisite > Webmaster Tools section > text field next to New Meta Tag
and click Add.
23
Generic Installation Guide, Yotpo

If you wish to also add the Sitemap please repeat the steps above for the
Sitemap (e.g. reviews.yoursitename.com/sitemap.xml). This ensures Google
and/ or Bing can crawl pages including URLs that may not be discoverable by
Google's and/ or Bings normal crawling process.

b. Inline SEO Experience - Recommended


To index your product reviews by search engines it is possible to pull product
reviews in HTML format. This HTML will then be server-side included into the
product pages.
In order to embed the static HTML retrieved from a Yotpo API end point, the
following steps are required:
The Widget's CSS code needs to be placed within the <head> tag of the
product page. The code below refers to the Widget's default look & feel:
<link href="http://staticw2.yotpo.com/app_key/widget.css"
rel="stylesheet" type="text/css"

media="all" />

Retrieve the reviews payload in the HTML format of the product pages via
the API call below. It is recommended to deploy the product's Star Rating
and Reviews Widget on each product page. This operation should take place
on the server side of the store/ website.
Method: GET
URL:
http://staticw2.yotpo.com/batch?methods=
[

"method":"main_widget",
"params":{"pid":"<Product ID>"}

},
{

"method":"bottomline",
"params": {
"pid":"<Product ID>"
}

}
]
&app_key=<app_key>

Content-Type: JSON
Mandatory parameters:

24
Generic Installation Guide, Yotpo

app_key - the account App Key


batch payload in the above example the batch response will be the full
HTML of a reviews widget which belongs to a specific product, and Star
Rating widget which belongs to the same specific product.
Response example:
[
{"method":"main_widget","result":"<div ..."},
{"method":"bottomline","result":"<span ..."}
]

It is highly recommended to develop a cache mechanism to save the payload


locally and to refresh it periodically. The purpose of this caching is to avoid
long loading times every time the widget loads.

c. Star Rating (Bottom Line) Feed via API


A list of all products, their reviews and their Star Rating (Bottom Line)
(including review amount and rating) can be called via our API. This way the
reviews content can be retrieved in xml or JSON formats and can be used for
SEO optimization purpose. For example: within feeds, within the JavaScript
Widget or regardless of the Widget.
The API call described below is required to return the list of reviews and their
Bottom Line.
Method: GET
URL:
https://api.yotpo.com/apps/{app_key}/bottom_lines?utoken={utoken}&since_
date={since_date}&since_id={since_id}
Content-Type: JSON
Mandatory parameters:
app_key - the account App Key
utoken - token retrieved from the create user response
The since_date and since_id parameters are not mandatory. Since_date is the
start date for pulling the data. This means, the first call doesnt need to contain
the parameter at all. To add new reviews in the future the last used date (in the
call) can be used as since_date.
Response example:
{

25
Generic Installation Guide, Yotpo

"status" : {
"code" : 200,
"message" : "OK"
},
"response" : {
"bottomlines" : [ {
"domain_key" : "62050632",
"product_score" : "3.45",
"total_reviews" : 11
}, {
"domain_key" : "62050052",
"product_score" : "3.0",
"total_reviews" : 3
}, {
"domain_key" : "62050122",
"product_score" : "4.64",
"total_reviews" : 11
}, {
"domain_key" : "73503772",
"product_score" : "4.76",
"total_reviews" : 17
}, {
"domain_key" : "92431514",
"product_score" : "4.52",
"total_reviews" : 25
}]
}
}

26
Generic Installation Guide, Yotpo

For code samples and a mockup of the API server please refer to Yotpos API
library at http://docs.yotpoapi.apiary.io/#bottomlineforallproducts.

About Yotpo
Founded in 2011, Yotpo is the leading provider of solutions for social reviews
management and UGC-driven marketing.
Feel free to contact us with any questions at
info@yotpo.com
+1 (646) 977-7959

Trademarks
Yotpo is a trademark of Yotpo Ltd.
All other product names mentioned herein are trademarks or registered
trademarks of their respective owners.

27
Generic Installation Guide, Yotpo