Builder.io - Integration Guide

Implement Yotpo through Builder and easily display reviews from Yotpo on your Builder pages.

How it works

Drag and drop a Yotpo app template onto any Builder page to collect product reviews and highlight existing reviews for specific products on any part of your storefront. You can completely customize the look and feel of the Reviews Widget so that every aspect matches your brand aesthetic. You can also A/B test how the reviews appear and where they appear to have the most impact.

We recommend using the services of a developer or contacting the Page Builder App team for the purpose of integrating this customization into your website.

Integrating Yotpo and Builder

You have two ways to add the Yotpo app template to your Builder content:

• Using the Yotpo native Reviews Widget
  This template loads much faster than the generic Reviews Widget, as it is native to Builder using Yotpo’s APIs.
• Using the Yotpo generic Reviews Widget
  Builder’s native embed template covers many of the most popular use cases (e.g. displaying and collecting reviews) but if there is a feature or capability missing that you need, then use the generic widget.

Using the Yotpo native Reviews Widget

To use the Yotpo native Reviews Widget on product pages:

1. Log into your Builder account.
2. Click Import from: Apps. A popup opens.
3. Select Yotpo Product Reviews.
4. Drop the app template anywhere on the page.
5. On the side panel, navigate to the Options tab.
6. Add the app key and, optionally, the Product ID (the product for which you want to collect and/or display reviews), Product URL, and Product title. How to find these values
   
   Please note:

   If using the Builder.io app for Shopify, the product id, product URL, and product title fields can be left blank when used on product pages as it will automatically pick up the product when used on product pages.
7. You should see your app template displaying your Yotpo review widget. Using Builder, you can now completely customize the look and feel of the Yotpo reviews, and even test different variations.

To use the Yotpo native Reviews Widget on other pages or sections:

1. Log into your Builder account.
2. Click Import from: Apps. A popup opens.
3. Select Yotpo Product Reviews.
4. Drop the app template anywhere on the page.
5. On the side panel, navigate to the Options tab.
6. Add the app key, Product ID (the product for which you want to collect and/or display reviews), Product URL, and Product title. How to find these values
7. You should see your app template displaying your Yotpo review widget. Using Builder, you can now completely customize the look and feel of the Yotpo reviews, and even test different variations.

Using the Yotpo generic Reviews Widget

To use the Yotpo generic Reviews Widget:

1. Log into your Builder account.
2. Click Import from: Apps. A popup opens.
3. Select Yotpo generic reviews widget.
4. Drop the app template anywhere on the page.
5. On the side panel, navigate to the Options tab.
6. Add the app key, store domain, and product handle. How to find these values
7. Optionally, you can add additional fields you'd like to capture in the form. See this guide for information about what options the sub-fields accept.
8. You should see your app template displaying your Yotpo review widget. Using Builder, you can now completely customize the look and feel of the Yotpo reviews, and even test different variations.

Required values

Required values for Yotpo native Reviews Widget:

Required values for Yotpo generic Reviews Widget: