How to Add Live Chat to Shopify, Wix, Webflow and Squarespace

Adding live chat to your website is rarely difficult, but each website platform hides the right place for a script in a different menu. If you want to add live chat to Shopify, Wix, Webflow or Squarespace, you do not need a developer or a special app. You need your chat widget’s installation snippet and the spot where your platform lets you add custom code to every page.
This guide shows where that spot is on each of the four platforms, what to paste, how to confirm the widget is working on desktop and mobile, how to configure its appearance and hours and what to check when the chat bubble does not appear. The examples use Talkmio, our AI live chat for websites, whose widget is one script tag. The steps for other chat tools are very similar, and the same principles apply.
Before You Start
A few preparations make the installation take minutes instead of an afternoon.
- Create the account and add your website. In Talkmio you create a free account, confirm your email and add your website under Websites. You receive a site key and an installation snippet.
- Copy the snippet exactly. It is a short piece of code containing your site key. Copy it with a plain text editor if your clipboard adds formatting.
- Know who can edit the site. You need an account with permission to change theme code or site-wide custom code.
- Decide whether to work on a copy. On Shopify, duplicating the theme before editing gives you a way back. On other platforms, note what you changed so that you can reverse it.
- Prepare the first answers. After installation, point the assistant at your website, add a few common questions or upload a price list so that it can answer visitors from your own content. Our Talkmio setup guide covers the full sequence.
The Principle: One Script on Every Page
Whatever the platform, a chat widget works the same way. A script loads on each page, finds your site key and draws the chat bubble in the corner of the screen. The Talkmio documentation says to paste the snippet before the closing body tag on every page, and the platform-specific notes below are just different ways to achieve that.
Two rules prevent most problems:
- Install the snippet once. Pasting it into both the theme and a custom-code area can create two bubbles or conflicting behaviour.
- Install it site-wide. If you paste it into a single page template, the chat appears only there.
| Platform | Where the snippet goes | Publish step |
|---|---|---|
| Shopify | Online Store, Themes, Edit code, theme.liquid, above the closing body tag | Save the theme file |
| Wix | Settings, Advanced, Custom Code, applied to all pages | Apply, then publish the site |
| Webflow | Site settings, Custom code, Footer code | Save, then publish to the domain |
| Squarespace | Settings, Advanced, Code Injection, Footer | Save and check the live site |
How to Add Live Chat to Shopify
Shopify themes are built from templates, and the one that wraps every storefront page is the layout file, usually called theme.liquid. The Shopify documentation on theme layouts explains how this file contains the shared structure of your pages.
Steps
- In the Shopify admin, open Online Store, then Themes.
- For safety, duplicate your live theme, so that you have a restore point.
- On the theme you want to edit, choose the three-dot menu and select Edit code.
- In the Layout folder, open theme.liquid.
- Find the closing body tag near the bottom of the file and paste the Talkmio snippet immediately above it.
- Save, then open your storefront in a new tab and check that the bubble appears.
Shopify notes
- If you change themes in future, repeat the steps on the new theme, because the snippet lives in the theme, not in the store settings.
- Theme code runs on storefront pages. Checkout pages are handled separately on Shopify and may not load theme code, so test whether the bubble appears at checkout rather than assuming it does.
- If you use a page builder app, check that it does not strip custom scripts from pages it controls.
- Chat is particularly valuable on product pages and in the cart, where shoppers ask about delivery, sizes and returns. Our article on live chat for e-commerce describes how to use it.
How to Add Live Chat to Wix
Wix has a dedicated area for adding third-party code to the whole site. The Wix help article on embedding custom code describes the options.
Steps
- Open your site’s dashboard and go to Settings.
- Find Custom Code under the Advanced section.
- Choose to add custom code and paste the Talkmio snippet.
- Give it a clear name, such as “Talkmio live chat”.
- Apply it to all pages and choose to load it in the body, end, or footer position as the Wix interface offers.
- Apply the change, publish your site and check the live address.
Wix notes
- Custom code may require a paid Wix plan or a connected domain, depending on current plan rules, so check what your plan allows.
- Changes to custom code appear on the published site, not always in the editor preview. Always test the live address.
- If your site has several languages or sections that use different page types, confirm that the code applies to all of them.
How to Add Live Chat to Webflow
Webflow lets you add custom code at site level or on individual pages. For a chat widget, the site-wide area is the right one.
Steps
- Open the project and go to Site settings.
- Open the Custom code tab.
- Paste the Talkmio snippet into the Footer code field, which loads before the closing body tag.
- Save the settings and publish the site to its domains.
- Visit the published page and confirm that the bubble appears.
Webflow notes
- Site-level custom code normally needs a paid site plan. The preview and the staging address may behave differently from the live domain, so test where visitors actually arrive.
- If you use the Webflow Designer preview only, the script may not run, which is expected. Publish first.
- If you use Webflow’s e-commerce or membership features, test the cart and account pages as well.
How to Add Live Chat to Squarespace
Squarespace calls its feature code injection. The Squarespace guide to using code injection explains the fields and the plans that include it.
Steps
- In the site panel, open Settings, then Advanced, then Code Injection.
- Paste the Talkmio snippet into the Footer field.
- Save and open your live site to check.
Squarespace notes
- Code injection is limited to certain plans, so check yours if the option is missing.
- Squarespace does not run injected code while you are logged in to the site editor in some views. Check in a private browser window.
- If you use a template with multiple sections or members-only pages, confirm that the widget appears where you expect it.
Other Platforms and Setups
Talkmio works with every website, since the widget is a single script. The integrations page lists the common routes: a plugin for WordPress, modules for PrestaShop, OpenCart, Magento, Joomla and Drupal, a Script Manager entry for BigCommerce, an HTML gadget for Blogger and custom-code or code-injection areas for Ghost, Framer, GoDaddy, Hostinger and others. For WordPress, install the Talkmio plugin and enter the site key in its settings, with no code editing at all. If you manage scripts through Google Tag Manager, you can load the widget from a container, which is convenient when marketing staff control tags, but remember to publish the container. For custom frameworks, you can place the script in the main layout or component.
Check That It Works
A quick set of checks takes five minutes and prevents silent failures.
- Open the live site in a private window. This avoids cached pages and being logged in to your platform.
- Look for the bubble on the homepage, a product or service page, a blog post and the contact page.
- Send a test message. Confirm it arrives in the inbox and that the assistant replies from your content.
- Test on a phone. Make sure the bubble does not cover important buttons such as add to cart or the cookie banner.
- Test from a second device or network if possible, to rule out cached or local issues.
- Check page speed. One extra script is usually light, but verify that your key pages still load quickly.
Customize Appearance, Hours and Behaviour
Once the widget is live, spend a little time on the settings for your website in Talkmio. You can change the colour and position, give the assistant a name, write the welcome and offline texts, choose whether the pre-chat form is none, optional or required, set the language to automatic detection or a fixed one and define business hours. Changes apply within about five minutes, so you do not need to touch the platform again.
Match the widget to the site
Use a colour that matches your brand and still contrasts with the page background. Place the bubble where it will not hide navigation or checkout buttons. On shops, bottom right is common; if your cookie banner sits there, move one of them.
Plan for the hours you are away
If nobody is online, the assistant can still answer from your content, and visitors can leave an email address for follow-up. Write an offline message that says honestly when someone will reply. For more on this, see after-hours live chat, and when you are ready to go further, read about chat triggers and rules.
Mind privacy and consent
A chat widget processes visitor data, so mention it in your privacy policy. Depending on your market and configuration, you may need to load it according to your cookie consent settings. Review these requirements for your jurisdiction and your consent tool before you launch.
Troubleshooting: The Bubble Does Not Appear
- The snippet is in the wrong place. It must be in a site-wide area, before the closing body tag or in the footer code field, not in a single page or a text block.
- The change was not published. Wix, Webflow and Squarespace all need the site to be saved or published.
- Cache. Clear the platform cache, the CDN cache and your browser cache, or test in a private window.
- Wrong site key or domain. Check that the key matches the website you added in Talkmio, and that the site is running on the domain you registered.
- Plan restrictions. The platform plan may not include custom code.
- Script blocked. Ad blockers, strict privacy extensions or a consent tool that has not yet received consent can prevent the widget from loading. Test with extensions disabled.
- Editor versus live. Some editors never run custom scripts. Always test the live address.
- Duplicated snippet. Two copies can conflict. Remove the extra one.
If you tried everything and the widget still does not appear, write down the platform, the place where you pasted the snippet and what you see in the browser console, then contact support or contact our team.
Frequently Asked Questions
Do I need a developer to add live chat to my website?
Usually not. On Shopify, Wix, Webflow and Squarespace you paste one snippet into a site-wide code area. On WordPress you can install a plugin and enter the site key instead.
Where exactly do I paste the Talkmio snippet?
Before the closing body tag on every page. In practice that means theme.liquid on Shopify, Custom Code on Wix, the Footer code field on Webflow and the Footer field of Code Injection on Squarespace.
Will live chat slow down my website?
A single chat script has a small effect, but any extra script adds some load. Test your key pages before and after installation, and keep the number of third-party scripts under control.
Can I show the chat only on some pages?
Platforms usually allow page-specific code, so you can place the snippet only where you want chat. Most businesses install it site-wide and then use the widget’s own rules and hours to control when it appears.
Does the chat widget work on mobile?
Yes, the widget is designed for both desktop and mobile visitors. Test your own pages on a phone, and make sure the bubble does not cover important buttons or banners.
What happens when nobody on my team is online?
The assistant can still answer from your content, hand over to a person when needed and ask the visitor for an email address if your whole team is offline. Your reply from the inbox then goes out as an email.
The Bottom Line
To add live chat to Shopify, Wix, Webflow or Squarespace, create the account, copy your snippet and paste it once into the site-wide code area of your platform: theme.liquid on Shopify, Custom Code on Wix, the Footer code on Webflow and Code Injection on Squarespace. Publish, test on the live address with a private window and a phone, then set the appearance, hours and first answers. With a clean installation and a few checks, chat starts working the same day.