Follow instructions below to install star rating on BigCommerce site.
To start, go to star ratings page. Copy star rating ID and paste it somewhere.
1) Loader Code
Go to BigCommerce settings page and check if install scripts is turned on. You can skip this step if auto installation is turned on.
If auto installation is turned off, you would need to manually install loader code to your site. Copy loader code and paste it before </head> tag of templates/layout/base.html file.
Loader code should be executed before all other OnVoard snippets. You only need to include loader code once. You can skip this step if you have already added loader code to your site.
<script>
(function() {
window.OnVoard = window.OnVoard || function() {
(window.OnVoard.q = window.OnVoard.q || []).push(arguments);
};
var script = document.createElement("script");
var parent = document.getElementsByTagName("script")[0].parentNode;
script.async = 1;
script.src = "https://scripts.onvoard.com/apps/loader.js";
parent.appendChild(script);
})();
</script>
2) Star Rating Snippet
Replace
STAR_RATING_ID for snippet below with actual star rating ID that you have copied earlier. Paste modified snippet on where you want star rating to appear. For this, you need to edit your theme file. Common files to look at: templates/components/products/product-view.html.<div
class="ov-app ov-app-star-rating"
data-app-id="STAR_RATING_ID"
data-app="star-rating"
data-product-external-id="{{ product.id }}">
</div>
Search for the following code:
itemprop="name"productView-title
Then place star rating snippet below it. This should position star rating just below product title element.
Need help installing?
If you need additional help to install, you can contact us.