Before you Begin
- Ensure that ecommerce products have been imported to OnVoard. If not, see how you can import products data. Reviews widget will only be shown when products have been imported into OnVoard.
- Ensure that Sync Product Flow is created so that newly created/updated products is automatically synced with OnVoard.
Follow instructions below to install reviews widget on BigCommerce site.
To start, go to reviews widget page. Copy reviews widget ID and paste it somewhere.
1) Loader Code
Go to BigCommerce settings page and check if install scripts is turned on. Proceed to next 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 </body> tag of layout/theme.liquid file. 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://widgets.onvoard.io/apps/loader.js";
parent.appendChild(script);
})();
</script>
2) Reviews Widget Snippet
Replace
REVIEWS_WIDGET_ID for snippet below with actual reviews widget ID that you have copied earlier. Paste modified snippet on product page file. 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-reviews-widget"
data-app-id="REVIEWS_WIDGET_ID"
data-app="reviews-widget"
data-product-external-id="{{ product.id }}">
</div>
You can place reviews widget snippet at the bottom of the file.
