---
title: "BigCommerce - Blueprint: Installing Yotpo on Blueprint"
slug: "bigcommerce-blueprint-installing-yotpo-on-blueprint"
updated: 2024-04-01T13:04:48Z
published: 2024-04-01T13:04:48Z
canonical: "support.yotpo.com/bigcommerce-blueprint-installing-yotpo-on-blueprint"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://support.yotpo.com/llms.txt
> Use this file to discover all available pages before exploring further.

# BigCommerce - Blueprint: Installing Yotpo on Blueprint

Products

			
				
					
						  

					
					Reviews
		
			

				

###### Supported plans

				

Free, Starter, Pro, Premium, Enterprise

			
			

				

###### eCommerce Platform

				

BigCommerce

			

In this article, you'll learn how to [integrate the Yotpo app into your BigCommerce store](https://www.yotpo.com/integrations/bigcommerce/).

	
	Please note:
	If you're using BigCommerce Stencil, please follow the instructions [here](/v1/docs/bigcommerce-stencil-installing-yotpo-reviews-on-stencil).

#### The installation process

In order for the installation process to go smoothly, we recommend that you follow the instructions carefully and ensure **not to skip any of the steps**
	
		
		Please note:
		
			You can preview any changes done within the Theme Files by clicking on the **Preview** button on the bottom of the screen.
	

## Installing the Yotpo Reviews App

1. Access your **BigCommerce admin.**
2. Click on **App.**
3. Click on **Marketplace.**
4. Search for **Yotpo** in the search box.
5. Click on the **Yotpo Reviews app.**
6. Click on **Install.**
7. Click **Confirm.**

## Installing the Yotpo JavaScript

1. Access your **BigCommerce admin.**
2. Click on **Storefront Design.**
3. Click on **My Themes.**
4. Click on **Edit HTML/CSS.**
5. Click **Other Template Files.**
6. Access the file **HTMLHead.html** which is located under **Panels.**
7. Add the **following code** after the last line of the file, just above **</head> section:**

	

```javascript
<script type="text/javascript">
(function e(){var e=document.createElement("script");e.type="text/javascript",e.async=true,e.src="//staticw2.yotpo.com/###YOUR-APP_KEY###/widget.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})();
</script>
```

	
	Please note:
	

		

Replace the **###YOUR-APP_KEY###** portion of the code above with your Yotpo API Key.

		

Can't find your API key? [Click here](/v1/docs/finding-your-yotpo-app-key-and-secret-key)

	

![](https://cdn.document360.io/f3c2ab59-fe4c-4f93-9614-2872f40e8aa7/Images/Documentation/873781e2-08b5-4825-bf03-6bdd47b5b826.png?sv=2026-02-06&spr=https&st=2026-10-31T18%3A16%3A54Z&se=2026-10-31T19%3A16%3A54Z&sr=c&sp=r&sig=gHfvhdGPAXN65UvhhsEPLM%2BNX3h3njYf8q0e3SWkXA4%3D)

1. Click **Save.**

## Installing Reviews Widget

1. Access your **BigCommerce admin.**
2. Click on **Storefront Design.**
3. Click on **My Themes.**
4. Click on **Edit HTML/CSS.**
5. Click **Other Template Files.**
6. Access the file **ProductDetails.html** which is located under **Panels.**
7. Add the **following code** after the last line of the file:

	

```javascript
<div class="yotpo yotpo-main-widget" 
data-product-id="%%GLOBAL_ProductId%%"
data-price="%%GLOBAL_RawProductPrice%%"
data-currency="%%GLOBAL_CurrentCurrencyCode%%" 
data-name="%%GLOBAL_ProductName%%" 
data-url=document.URL 
data-image-url="%%GLOBAL_ThumbImageURL%%" 
data-description=""> 
</div>
```

![](https://cdn.document360.io/f3c2ab59-fe4c-4f93-9614-2872f40e8aa7/Images/Documentation/420f89ef-af88-4f44-ac1a-8f661ad40116.png?sv=2026-02-06&spr=https&st=2026-10-31T18%3A16%3A54Z&se=2026-10-31T19%3A16%3A54Z&sr=c&sp=r&sig=gHfvhdGPAXN65UvhhsEPLM%2BNX3h3njYf8q0e3SWkXA4%3D)

1. Click **Save.**

	
	**Please note:**
	
		**If the Reviews Widget does not appear on the product page, add the code after the last line of the ProductDescription.html file.** 

## Installing Star Rating on product pages

This step is optional.

1. Access your **BigCommerce admin.**
2. Click on **Storefront Design.**
3. Click on **My Themes.**
4. Click on **Edit HTML/CSS.**
5. Click **Other Template Files.**
6. Access the file **ProductDetails.html** which is located under **Panels.**
7. Add the following code after this line*:*
		  
***<h1 itemprop="name">%%GLOBAL_ProductName%%</h1>****:*
		
			

```javascript
<div class="yotpo bottomLine"
data-product-id="%%GLOBAL_ProductId%%"
data-url="%%GLOBAL_ProductLink%%">
</div>
```
8. Click **Save.**

## Installing conversion tracking code

1. Please **copy** the following code:
		
		
			

```javascript
<script type="text/javascript">(function e(){var e=document.createElement("script");e.type="text/javascript",e.async=true,e.src="//staticw2.yotpo.com/{{APP_KEY}}/widget.js";var t=document.getElementsByTagName("script")[0];t.parentNode.insertBefore(e,t)})();</script><script>yotpoTrackConversionData = {orderId: "%%ORDER_ID%%", orderAmount: "%%ORDER_AMOUNT%%", orderCurrency: "USD"}</script><noscript><img src="//api.yotpo.com/conversion_tracking.gif?app_key={{APP_KEY}}&order_id=%%ORDER_ID%%&order_amount=%%ORDER_AMOUNT%%&order_currency=USD" width="1" height="1"></noscript>
```

		
			
			Important:
			BigCommerce [only allows](https://support.bigcommerce.com/articles/Public/Passing-Order-Data-to-Affiliate-Programs/?_ga=2.22180530.889572232.1528892386-177848363.1528623067#tracking-variables) USD currency in the Conversion Tracking. If your store's currency is not USD, **replace it** with the correct value
2. In your BigCommerce admin, go to **Advanced Settings > Web Analytics.**
3. Check the box next to **Affiliate Conversion Tracking.**![](https://cdn.document360.io/f3c2ab59-fe4c-4f93-9614-2872f40e8aa7/Images/Documentation/da88a338-f3b1-42d1-b987-06c8ca7e9b55.png?sv=2026-02-06&spr=https&st=2026-10-31T18%3A16%3A54Z&se=2026-10-31T19%3A16%3A54Z&sr=c&sp=r&sig=gHfvhdGPAXN65UvhhsEPLM%2BNX3h3njYf8q0e3SWkXA4%3D)
4. Click the **Save** button at the bottom of your screen.
5. Click on the **Affiliate Conversion Tracking**  tab **paste your code** into the Conversion Tracking Code box:![](https://cdn.document360.io/f3c2ab59-fe4c-4f93-9614-2872f40e8aa7/Images/Documentation/38a7c019-199f-4a4e-99e1-a3501e0c318f.png?sv=2026-02-06&spr=https&st=2026-10-31T18%3A16%3A54Z&se=2026-10-31T19%3A16%3A54Z&sr=c&sp=r&sig=gHfvhdGPAXN65UvhhsEPLM%2BNX3h3njYf8q0e3SWkXA4%3D)
6. Replace both **{{APP_KEY}}** portions of the code above with your store's **Yotpo app key.**

	
	Important!
	

		

Make sure to replace the **two** {{APP_KEY}} portions of the code with the App Key from your account.

		

**Can't find your App Key?** [Click here](/v1/docs/)

	

1. Click **Save**.

	
	Tip:
	We recommend that you make a [test order](https://support.bigcommerce.com/articles/Public/Testing-Shipping-Tax-and-Payment-Settings) to check the installation.

## Installing Star Rating on category pages

This step is optional.

1. Access your **BigCommerce admin.**
2. Click on **Storefront Design.**
3. Click on **My Themes.**
4. Click on **Edit HTML/CSS.**
5. Click **Other Template Files.**
6. Access the file **CategoryProductsItem.html** is located under **Panels.**
7. Add the following code where you want the Star Rating to appear - the exact location depends on your store:
		
			

```markup
<div class="yotpo bottomLine"
data-product-id="%%GLOBAL_ProductId%%"
data-url="%%GLOBAL_ProductLink%%">
<div>
```
8. Click **Save.**

## Importing reviews

The import process is done via [BigCommerce](https://www.yotpo.com/integrations/bigcommerce/) API, so there is no need to export or manually handle files.

In order to import reviews from BigCommerce, you must:

- Have used the BigCommerce native reviews app, now disabled.
- Submit a ticket to Yotpo Support in [here](https://yap.yotpo.com/#/tools/map/map?appkey=Rsm5Bp4kp3x0WprcB1Vn4ZCuzXhLeyXXcxa6icT3&amp;modal=contact_support&amp;utoken=L9P10G6WIWQQnDacfosUq3fEmfgcK1tO7SESPmVQ) with the following message:

*Please import my BigCommerce reviews into Yotpo. -Send me a file with the data from BigCommerce to review before importing -* ***Yes / No*** *-Apply Verified Buyer badge -* ***Yes / No***

	
	Important:
	Since BigCommerce reviews don't fully match Yotpo's format, certain types of data may be modified or lost, click [here](/v1/docs/) to learn more