Install the AI Shopping Assistant on your storefront
Copy the embed code from the agent's Install Tags tab into your site's main template, before the closing body tag. On Shopify, turn on the Shopping Assistant app embed in your theme editor instead. Shoppers see the AI Shopping Assistant only while the agent is active.
Before you start
Section titled “Before you start”Use this guide when an agent answers well in the Playground and you want shoppers to see it on your storefront. Stores that use the Webscale AI console add the embed code from Install Tags. Stores that use the Webscale AI app in your Shopify admin turn on an app embed in the theme instead.
The AI Shopping Assistant shows on your storefront only while its agent is active. Draft and inactive agents stay hidden, even with the code in place. The Install tags reference describes every field on the tab.
Add the embed code to your site
Section titled “Add the embed code to your site”- Go to Assistant > Agents and check that the agent’s Status reads Active. If it doesn’t, turn on the switch in the Status column or select Activate in the row menu.
- Open the agent with Edit in the row menu and select the Install Tags tab.
- Under step 1 on the tab, select Copy. The button reads Copied! once the code is copied. If the code block reads “No snippet available. Save the agent first to generate the embed code.”, select Save and copy the code again.
- Paste the code into your website’s main template, before the closing
</body>tag. The template loads on every page, so the AI Shopping Assistant does too. - Publish the template change to your live storefront. Clear your storefront’s page cache if your platform caches pages.
- Back on the Install Tags tab, under “Confirm onsite tracking is enabled”, enter a storefront page in Website URL and select Confirm. The button reads Verifying… while the console checks the page.
Turn on the app embed in Shopify
Section titled “Turn on the app embed in Shopify”- In your Shopify admin, open the Webscale AI app and go to its Get Started page.
- In the Setup guide, find the Enable the widget step and select Enable in Theme Editor. Your theme editor opens at the App embeds panel.
- Switch on Shopping Assistant. Inside the app embed, Enable Shopping Assistant is on by default.
- Leave Agent Code (Optional) blank to use the storefront agent selected in the Webscale console.
- Select Save in the theme editor.
- Return to the Get Started page in the app and select Mark as done on the Enable the widget step. The app can’t detect the app embed, so the step stays open until you mark it.
Check that it worked
Section titled “Check that it worked”Open your storefront in a private browser window and go to any page. The AI Shopping Assistant appears on the page. Open it and check that it shows your agent’s name, logo and welcome message. Ask a question you tested in the Playground. The reply should match what you saw there.
If you used the embed code, the Install Tags tab shows “Verified on” with the date after Confirm finds the code on your page.
Troubleshooting
Section titled “Troubleshooting”| Problem | Fix |
|---|---|
| The AI Shopping Assistant doesn’t appear | Check that the agent’s Status reads Active on Assistant > Agents. Draft and inactive agents stay hidden on the storefront |
| The code block reads “No snippet available” | Select Save on the agent. The embed code appears after the first save |
| Confirm shows “Verification failed. Please check the URL and try again.” | Check that Website URL is a full page address that loads in a browser. Code added by a tag manager may not verify because the check reads the page’s HTML as your server returns it |
| The code is in the template but nothing shows | Check that the template change is published to your live storefront. Clear your page cache and reload |
| Nothing shows on Shopify after you switch on the app embed | Check that you selected Save in the theme editor and that Enable Shopping Assistant is on |
| Nothing shows on Shopify when Agent Code (Optional) has a value | Check that the code belongs to an agent that exists and isn’t archived. An unknown or archived code shows nothing. Clear the field to use the storefront agent |
| A saved change doesn’t show on the storefront | Reload the page. The AI Shopping Assistant loads saved settings each time a page loads |
Frequently asked questions
- Why doesn't the AI Shopping Assistant appear after I add the embed code?
- The agent is probably not active. Draft and inactive agents stay hidden on the storefront. Activate the agent on the Assistant > Agents list, then reload your storefront.
- Do I need to update the embed code when I change the agent's settings?
- No. The embed code only identifies the agent. The AI Shopping Assistant loads its saved settings each time a page loads, so saved changes appear without touching the code.
- Why does Confirm fail when the AI Shopping Assistant shows on my site?
- Confirm reads the page's HTML as your server returns it. Code that a tag manager adds later in the browser isn't in that HTML, so the check can fail even though shoppers see the AI Shopping Assistant.
- Can I use a different agent on a Shopify preview theme?
- Yes. In the preview theme's editor, open the Shopping Assistant app embed and enter that agent's code in Agent Code (Optional). Leave the field blank to use the storefront agent selected in the Webscale console.