This article will help you install TrustSpot on your Stencil-Based Themes with BigCommerce.
Note for Blueprint Users: If you are using a Blueprint theme, please see our instructions here.
Prepare Store for Implementation
Before installing TrustSpot to your store, it's important to disable the existing native review system. This helps to prevent customers from receiving duplicate review request emails.
Follow Steps 1 - 3 below to disable the native BigCommerce review app, and install TrustSpot.
Step 1: Disabling the Built-in Reviews System and Review Requests
Log in to your BigCommerce Admin page.
Click Advanced Settings.
Click Comments.
Click Built-in.
Deselect the Product reviews checkbox.
Click Save
Step 2: Disabling the Built-in BigCommerce Review Requests Sent to Customers
Click Store Setup.
Click Store Settings.
Click Miscellaneous.
Deselect the Product Review Emails checkbox.
Click Save
TrustSpot Integration
Step 1: Installing the TrustSpot Reviews App
Click here to view our BigCommerce App and install it to your store.
Select the "Get this App" button to start the install process. You will be asked to confirm the install of the app. Once you click "Confirm", the app will be installed.
Step 2: Add TrustSpot Javascript to Site
The TrustSpot Javascript code is required to load all review elements on your store.
1. In your TrustSpot account, click Site Integrations from the left sidebar then BigCommerce.
Copy the <script> tags under Step 2: Add the TrustSpot Javascript.
We'll come and add the <link> later.
2. Log into BigCommerce. Click Storefront > Script Manager.
3. Click Create Script.
Name the script TrustSpot.
Select Footer as the Location.
Select All pages.
Select Script and paste the two scripts you copied above.
Click Save.
4. In your TrustSpot account, click Site Integrations from the left sidebar then BigCommerce.
To get started, click on the following:
Storefront > My Themes > Advanced > Make a Copy
Once the theme is copied, click on Edit Theme Files under the Advanced drop down
5. In your TrustSpot account, click Site Integrations from the left sidebar then BigCommerce.
Copy the <html> tags under Step 2: Add the TrustSpot Javascript.
6. In BigCommerce, click Storefront > My Themes > Edit Theme Files. From here you need to locate the base.html file.
Paste the code you copied directly above {{{footer.scripts}}} at the bottom of the page.
Step 3: Add the Reviews Widget on the Product Page
The Review Widget is the main display on your site, which showcases all of your great Product & Company Reviews, Photos, and Product Q&A.
1. In your TrustSpot account, click Site Integrations from the left sidebar then BigCommerce.
Click copy under Step 3: Add the Reviews Widget on the Product Pages.
2. In BigCommerce, click Storefront > My Themes > Edit Theme Files. From here, you need to locate your product template to add the TrustSpot code.
Click Templates > Components > Products > product-view.html OR product.html (depending on your theme).
3. Paste the code you copied above at the bottom of the page.
Step 4: Add the Inline Star Rating on the Product Pages
1. In your TrustSpot account, click Site Integrations from the left sidebar then BigCommerce.
Click copy under Step 4: Add the Inline Star Rating on the Product Pages.
2. In BigCommerce, click Storefront > My Themes > Edit Theme Files
3. Click Templates > Components > Products > product-view.html, product.html OR single-details.html (depending on your theme).
4. Paste the code you copied above under the "productView-title" code line. To find this line quickly, use: CTRL+F on Windows or command + F on Mac to search.
5. Click Save
Step 5: Add the Category Star Rating to the Category Page
1. In your TrustSpot account, click Site Integrations from the left sidebar then BigCommerce.
Click copy under Step 4: Add the Inline Star Rating on the Category Pages.
2. In BigCommerce, click Storefront > My Themes > Edit Theme Files
3. Click Templates > Components > Products > card.html (if your theme does not have this file, you will need to locate the file which contains the Category Page data).
4. Paste the code you copied above under the "card-title" code line. To find this line quickly, use: CTRL+F on Windows or command + F on Mac to search.
5. Click Save
Have a question or need support on this integration?
Please contact our support team from here.