How to Install Reviews for BigCommerce Stencil Themes

Overview

Sendlane Reviews is the perfect complement to any BigCommerce store and provides plenty of widget customization options to seamlessly blend with your website's branding! Read on to learn how to install Sendlane Reviews in your BigCommerce store's Blueprint theme. If you use a Blueprint theme in your BigCommerce store, follow this installation guide.

In This Guide

1. Install the Product Review Widget Script
2. Install the Product Review Widget Element
3. Install the Star Widget Element
4. Uninstall Existing Reviews Widget

• Next Steps
• Troubleshooting

1

 Install the Widget Script

The product review widget script connects your BigCommerce store to your Sendlane account.

Copy the Product Review Widget Script

1. Login to Sendlane
2. Click the Reviews icon
3. Click Product Review
4. Click Get Widget Code
5. Under Widget Script, click Copy Code

Paste the Review Widget Script

1. Login to BigCommerce
2. Click Storefront
3. Click Script Manager
4. Click Create new script
   1. Script Name: Sendlane Reviews
   2. Location on Page: Footer
   3. Select pages to add script: Storefront pages
   4. Script Category: Essential
   5. Script type: Script
   6. Script: Paste the copied product review widget script
5. Click Save

2

 Install the Widget Element

The reviews widget element tells your BigCommerce store where to display product reviews for individual products on your product pages. You can install the widget element in the default product page template file, and Sendlane Reviews will automatically only display reviews for the product that appears on the page.

Copy the Product Review Widget Element Code

1. Login to Sendlane
2. Click the Reviews icon
3. Click Product Review
4. Click Get Widget Code
5. Under Widget Element, click Copy Code

Paste the Product Review Widget Element Code

1. Login to BigCommerce
2. Click Storefront Design
3. Click My Themes
4. Click Edit HTML/CSS
5. Click Other Template Files
6. Scroll to Panels
7. Click ProductDetails.html (if you do not see a ProductDetails.html file, look for a file with the word product in the name)
8. Paste the product review widget element code directly after the last line in the file
9. Click Save

To check that the review script and widget were installed correctly, click Preview Store, then click on a product and scroll down.

If you’ve imported reviews, you should see any existing reviews for the product you clicked on.

If you have not imported reviews, you should see a section to write the first review for the product you clicked on.

3

 Install the Star Widget Element

The star widget element displays a product’s average star rating on individual product pages and on product category pages.

Because BigCommerce themes vary, you may need to try more than one location when installing the star rating widget.

1. Login to BigCommerce
2. Install the star rating widget on individual product pages
   1. Click Storefront Design
   2. Click My Themes
   3. Click Edit HTML/CSS
   4. Click Other Template Files
   5. Scroll to Panels
   6. Click ProductDetails.html
   7. Paste the following snippet where you want the product’s average star rating to appear on the page: <div sl-product-id="{{product.id}}" sl-type="mini"></div>.
      1. The two most common places for the star widget are under the product’s price or title. Click into the code, press CTRL + F or Command + F, and search for product__price div for the product's price or <h1 {{#if schema}}itemprop="name"{{/if}}>{{product.title}}</h1> for the product’s title.
3. Install the star rating widget on product category pages
   1. Click Products
   2. Click Category
   3. Click product-listing.html
   4. Paste the following snippet where you want the product’s average star rating to appear on the page. <div sl-product-id="{{product.id}}" sl-type="mini"></div>.
4. Click Save

To check that the star widget was installed correctly, click Preview Store, then click on a product.

4

 Uninstall Existing Reviews Widget

If you are using BigCommerce's native reviews platform, uncheck the Product Reviews checkbox in your comments' settings. See BigCommerce's guide for more information.

If you are using another reviews platform, follow the instructions provided by your platform to uninstall. Check out the uninstallation guides for common reviews platforms here:

• Yotpo
• Stamped
• Judge.me*
• Okendo*

*Uninstall the widgets from locations noted in the installation guide

Troubleshooting

My theme doesn't have a ProductDetails.html file!

BigCommerce theme file names can vary across themes. Look for files with the word "product" in the name.

My theme doesn't have any of the recommended files or tags to place a widget!

Because themes vary widely, you may have to experiment with widget placement. If you already use another reviews product, try placing your widget scripts in the exact same spot your existing widgets were installed in.