You can add a chat widget to Shopify's theme.liquid without risk if you do three things: duplicate the theme first, paste the single script tag just above the closing </body> tag and outside any Liquid logic, and check the line is still there after every theme update or switch. Done that way it's a one-line change you can reverse in seconds. Most broken themes come from pasting in the wrong place or editing without a backup.
This guide is about doing the edit safely. If you want to know what a script-tag chatbot can and can't do on Shopify in the first place, read Shopify chatbot without an app first.
Step 1: make a backup copy
Shopify's help center recommends duplicating your theme before you edit its code, so you can discard your changes and start again if you need to. At the time of writing (October 2026), the steps are:
- In Shopify admin, go to Online Store, then Themes.
- Next to your current theme, open the actions menu (the three dots) and click Duplicate.
- The copy appears in your theme library named "Copy of" plus the theme name.
Shopify notes one limit: if you already have 20 themes in your admin, you need to delete one before you can duplicate another.
You now have a choice about which theme to edit.
- Edit the live theme, keep the copy as a backup. Best for a one-line addition like a chat widget. Your live theme keeps every setting you've made, and the copy is there if anything goes wrong.
- Edit the copy, preview it, then publish it. Safer for larger changes. Be aware the copy is a snapshot: anything you change on the live theme after duplicating isn't in it.
For a chat widget, the first option is usually right.
Step 2: paste in the right place
Open the code editor: from Online Store, open the theme's actions menu and choose Edit code. In the Layout folder, open theme.liquid.
Use the editor's search (Ctrl+F or Cmd+F) to find </body>. Put the cursor at the start of that line, press Enter to make a new line above it, and paste your chatbot's script tag there. Click Save.
Where people go wrong:
- Inside Liquid logic. If the line just above
</body>is inside an{% if %}block or a{% comment %}block, your script inherits that condition or never prints at all. Paste it outside them. - In the head. Shopify's layout documentation says
content_for_headermust sit inside the head and loads the scripts Shopify needs. Leave that area alone. A chat widget doesn't need to be in the head, and putting it there can delay the first paint of your store. - In a section file. Sections only render where they're used. A script in one section file appears on some pages and not others.
- Deleting something by accident. Shopify won't let you save theme.liquid if
content_for_headerorcontent_for_layoutis missing, which is a useful safety net. If the editor refuses to save, undo your last change rather than forcing it.
Two copies of the snippet won't break anything. SpideyChat's widget mounts once per bot and ignores a second copy. Still, keep one, so there's only one place to change.
Step 3: check it worked
Open your store in a private window. You should see the chat button in the bottom-right corner. If not, view the page source and search for widget.js. One script tag with your bot's data-bot-id should appear. If the bot ID is wrong, compare it with the one on your chatbot's page (find your bot ID).
Then open the browser console and filter for "SpideyChat". The widget writes a line there when something is wrong, such as a missing bot ID or a website that isn't on the chatbot's license. Our troubleshooting checklist explains each message.
One Shopify-specific licensing detail: a SpideyChat chatbot registers the first website it loads on. If you first load your store on its myshopify.com address and later on your custom domain, those are two different websites. Add your custom domain under License & websites on the chatbot's page. The Free plan covers 1 website per chatbot and Starter covers 3.
How to undo it
To remove the widget, delete the line and save. That's the whole uninstall, because the widget adds nothing else to your theme files.
If you've made a mess of the file, Shopify's code editor has a Timeline view that restores an individual file to an earlier version. Shopify warns that the history is finite and that restoring replaces the entire file, so you could lose other changes made since. The duplicate theme from step 1 is your fallback if the timeline doesn't reach back far enough.
Theme updates and switches
This is where chat widgets quietly vanish months later.
- Theme updates. Shopify's help center says that if changes you've made to a theme's code are incompatible with a theme update, all your code changes are removed in the updated copy. After any update, open theme.liquid and check the line is still above
</body>. - Switching themes. A new theme starts with its own theme.liquid, without your snippet. Paste it in again before you publish the new theme.
- Templates with their own layout. Shopify's documentation says a template can choose which layout to use, or no layout at all. If chat shows on most pages but not one type, check whether that template uses a different layout file and add the snippet there too.
Keep a copy of your snippet somewhere you'll find it, such as a note with your store logins. Re-pasting is a minute's work.
Why it won't show on checkout
Shopify's developer documentation says general layouts like theme.liquid apply to all non-checkout pages. A script added there doesn't load on checkout, whatever the chat vendor. That's not a fault in your install.
The practical answer is to handle checkout questions before the shopper gets there: shipping costs, delivery times, payment methods, discount codes and returns. An assistant trained on your policy pages answers those on product and cart pages, which is where the hesitation usually happens.
Ready to paste
Duplicate, paste above </body>, save, test in a private window, and recheck after theme updates. The Shopify integration page has the install steps in one place, and our original Shopify install guide covers training the assistant on your store.