Last updated: 2026-10-25
Before you start
This guide uses PrimeWebKit's standard website widget: one external script that loads the chatbot configured in your account. It does not install a native Shopifyplugin or automatically connect your site's private data. The platform-specific steps below explain where the snippet belongs and what to verify before making a live change.
- A published PrimeWebKit bot and its complete widget snippet from the bot's Widget tab.
- Shopify staff or owner access with permission to edit the online store theme code.
- A duplicate or backup of the theme if you are editing a live storefront.
- The storefront domain allowed in the bot's domain settings, if domain restrictions are enabled.
Installation steps
1. Open the theme code editor
Editor or file path: Shopify admin → Online Store → Themes → Edit code
This is the theme editor path documented in the project's current installation guide. Confirm that you are editing the theme that is published, or work on a duplicate theme and preview it before publishing. Theme changes can affect all storefront pages.
2. Open the shared theme layout
Editor or file path: Edit code → Layout → theme.liquid
Open theme.liquid and find its closing body tag near the bottom of the file. Paste the complete bot snippet immediately before that tag so the widget can load across the storefront. Do not add it separately to individual product, collection, or content templates if you want one site-wide widget.
3. Save and verify the storefront
Editor or file path: theme.liquid → Save; preview the theme or test the published storefront
Save the change, preview the theme, and test a public product or collection page. If you edited a duplicate, publish it only after the preview behaves as expected. Check the live page in a private browser window to avoid confusing an old cached page with the new theme.
Widget snippet
Copy the snippet from the selected bot's Widget tab whenever possible. The example below shows the format for your reference; replace the example identifier only with the bot ID from your own copied snippet.
<script src="https://api.primewebkit.com/widget.js" data-bot-id="YOUR_BOT_ID" async></script>
This illustrates the snippet format. Copy the live snippet from the Widget tab; use the bot ID for the bot you want on the storefront.
Platform-specific notes
The script is independent of Shopify product data: it displays the bot configured in PrimeWebKit and does not automatically read product inventory, prices, customer accounts, or order status. Add only verified store policies and product information to the bot's knowledge sources.
If the storefront has consent controls or a custom content-security policy, follow the store's existing privacy and security practices. Do not add broad script permissions or duplicate the widget as a workaround for a blocked load.
Before publishing, review any site-wide consent banner, security policy, and domain restrictions already in place. Add the widget only to the pages and hostnames where it is intended to run, and avoid copying account secrets or private customer data into the page source.
Verify the chatbot is working
Test a published page, not just an editor preview. Confirm the launcher is visible, opens when activated, and accepts a question. Ask something answered by the bot's current knowledge sources, then check that an unrelated or unsupported question is handled within the limits of the bot's instructions.
Repeat the check on another page that shares the layout and on each hostname visitors use, such as a staging host and the production domain. If the bot is restricted to allowed domains, include the exact hostname for each environment before testing. Inspect the browser console and Network panel if the script or API request fails; record the specific error rather than changing unrelated settings.
Common problems
The widget does not appear
Confirm that the page was published with the script, the bot ID is correct, and the exact site hostname is allowed in the bot's domain settings. Check the browser console and Network panel for blocked or failed requests, then clear the site's page cache and test the public page again.
A cache or optimization tool serves an old page
Purge the relevant page, hosting, or CDN cache after publishing. Temporarily compare the public page in a private browser window and inspect its page source for the script before changing other settings. Avoid disabling all optimization or security features as a first step.
A content-security policy blocks the script
A CSP can prevent the browser from loading an external script or connecting to the widget service. Read the exact blocked origin in the browser console, then have the site administrator update only the applicable script-src or connect-src policy after verifying the required host. Do not use a wildcard policy as a workaround.
A builder or plugin changes the injected code
Some page builders, script managers, and cache plugins defer, rewrite, or sanitize custom code. Check the published HTML and console, confirm the tool supports external scripts in the chosen location, and remove duplicate copies before trying another injection point.
Frequently asked questions
Where do I get the Shopify chatbot script?
Open the bot you want to publish in PrimeWebKit, go to its Widget tab, and copy the complete snippet shown there. Use that bot-specific script and ID rather than a placeholder or a snippet from another bot.
Can the chatbot appear on every Shopify page?
Yes, when the script is added once to a shared site-wide layout or footer that is included on those pages. If you place it in a page-specific block or template, it may only appear on that page. Test more than one public page after publishing.
Do I need a Shopify plugin?
No. The verified method in the existing documentation is to add the script to theme.liquid. This guide does not rely on a Shopify app or claim that PrimeWebKit is installed through a native Shopify plugin.
What should I check if the widget is missing?
Check that the latest page was published, the script and bot ID are present, and the tested hostname is allowed in the bot settings. Then inspect the browser console and Network panel for blocked or failed script requests and clear relevant caches.
Can a content-security policy block the chatbot?
Yes. A restrictive CSP may block the widget script or its network requests. Use the exact blocked origin reported by the browser and ask the site administrator to update the relevant policy narrowly; do not add wildcard permissions.
How do I avoid loading the widget twice?
Place the script in one shared insertion point only. Do not add a second copy in a page block, another theme file, or a script plugin if it is already in the global layout. Check the rendered page source when troubleshooting duplicate launchers.