1. Site-wide chat (Script Manager)
- Admin → Storefront → Script Manager → Create a Script.
- Name:
askthe.bot chat. Location: Footer. Pages: All pages. Type: Script. - Paste:
<script async src="https://askthe.bot/embed.js" data-agent="YOUR-SLUG"></script>2. Try-on on product pages (Stencil)
Edit templates/components/products/product-view.html in your Stencil theme. Add this near the add-to-cart block:
<button type="button" id="atb-tryon" class="button button--primary"
style="margin-top:12px;width:100%">Try it on</button>
<script async src="https://askthe.bot/tryon.js"
data-agent="YOUR-SLUG" data-auto-button="false"></script>
<script>
document.getElementById('atb-tryon').addEventListener('click', function () {
window.AskTheBotTryOn && window.AskTheBotTryOn.open({
productImage: {{json product.main_image.data}},
productLabel: {{json product.title}},
productUrl: window.location.href,
});
});
</script>3. Variant-aware (Stencil)
BigCommerce fires the product-options-change event when an option changes. Update the image at click time:
<script>
var current = { image: {{json product.main_image.data}}, label: {{json product.title}} };
document.addEventListener('product-options-change', function (e) {
if (e.detail && e.detail.image) current.image = e.detail.image;
});
document.getElementById('atb-tryon').addEventListener('click', function () {
window.AskTheBotTryOn.open(current);
});
</script>Troubleshooting
- Script Manager not showing on PDPs: check the page rule includes Product pages.
- "Domain not allowed": add your
.mybigcommerce.comdomain AND your custom domain in agent Profile → Allowed domains.