To add live chat to a website builder site, copy your chat tool's embed code and paste it into the builder's site-wide custom code area, set to load before the closing body tag on every page. In Wix that's Settings → Custom Code, in Squarespace it's Code Injection (footer), and in Webflow it's the Footer code field in your site settings. Then publish, add your domain to the chat tool's allowed list, and test in a private browser window. No plugin or developer is needed.
This guide walks through each builder, then covers testing and troubleshooting.
Before you start
Have these ready:
- Your chat tool's embed code and, if it uses one, your widget key.
- Your live domain. Some builders only run custom code on a published site with a connected domain.
- A plan that allows custom code. Builders often limit code features to certain plans, so check yours before you start.
- Your chat tool's allowed websites list, if it has one. Many tools only load on domains you've approved, which stops others from copying your code onto their sites.
A typical embed code is one line, like RetroChat's:
<script async src="https://theretrochat.com/widget.js" data-key="YOUR_WIDGET_KEY"></script>
The async attribute lets the page keep loading while the chat script downloads in the background.
Wix
Wix's help center describes adding site-wide code under the site dashboard (Wix: Embedding Custom Code on Your Site):
- Open your site's dashboard and go to Settings.
- Under Development & integrations, click Custom Code.
- Click + Add Custom Code and paste the embed code.
- Give it a recognizable name, such as "Live chat".
- Under Add Code to Pages, choose All pages and set it to load on each new page.
- Under Place Code in, choose Body – end.
- Click Apply.
According to Wix's documentation, your site must be published and have a connected domain to use custom code, and code snippets are removed if you assign a different domain to the site. If you change domains later, check the chat is still there.
Use the site-wide Custom Code setting rather than an "embed" element dropped onto one page. Page-level embed elements can sit inside their own box on the page, which is not what you want for a chat button that should float over every page.
Squarespace
Squarespace calls this feature Code Injection (Squarespace: Using code injection):
- Open your site settings and find the Code Injection panel.
- Paste the embed code into the Footer field.
- Save.
Things to know from Squarespace's documentation:
- Code injection is available on the Core, Plus, Advanced and some legacy plans.
- Custom code doesn't run in the editor's preview. To see the chat, open your live site in a private or incognito window.
- Code injection can't be added to checkout pages, so don't expect the chat there.
Webflow
In Webflow, site-wide code goes in your site settings, in the Custom Code section (Webflow University: site-level custom code):
- Open your site settings and go to Custom Code.
- Paste the embed code into the Footer code field, which places it before the closing body tag on every page.
- Save, then publish the site.
Webflow University recommends publishing the site and confirming the code appears on every page rather than relying on Preview, so check your staging or live domain. If you test on a staging address, add that domain to your chat tool's allowed list too.
Other site builders
Most builders have an equivalent, even if the name differs. Look in site settings for:
- "Custom code," "code injection" or "footer code"
- "Header and footer scripts" or "tracking code"
- "Advanced" or "Developer" settings
Wherever it lives, the rules are the same:
- Site-wide, not one page, unless you deliberately want chat only on certain pages.
- Before the closing body tag (footer or body-end) is the usual placement.
- Publish after saving. Most builders don't run custom code in the editor.
If your builder only offers page-level embed blocks, check its help center for a site-wide option before pasting the code onto each page individually.
Test it properly
Don't trust the editor preview. Test the live site:
- Open your site in a private window and wait a few seconds for the chat button.
- Check a few different pages, including your contact and pricing pages.
- Open the chat on your phone, not just a desktop browser.
- Send a test message and confirm it arrives in your chat inbox.
- Ask for a person while nobody is online and check the offline message.
- Make sure the chat button doesn't cover another button, such as a cookie banner or "back to top" link. If it does, switch its position.
Troubleshooting
| Problem | Likely cause | Fix |
|---|---|---|
| No chat button on the live site | Domain not in the chat tool's allowed list | Add the domain (and www. or staging versions if needed) |
| Works on the live site, not in the editor | Builders often don't run custom code in preview | Test on the published site |
| Works on some pages only | Code added to one page, not site-wide | Move it to the site-wide footer setting |
| Disappeared after a domain change | Some builders remove custom code when the domain changes | Paste it again |
| Chat appears inside a box, not floating | Pasted into a page embed element | Use the site-wide custom code area instead |
| Still old version after changes | Browser or CDN cache | Reload in a private window |
Open the chat from your own button
Many sites add a "Chat with us" link on the contact page. With RetroChat, a button can call RetroChat.open() once the widget has loaded. This needs to run on the page itself, so if your builder only allows custom scripts in the site-wide code area, ask a developer or keep it simple and rely on the floating chat button. The install guide shows the available calls.
How to do this in RetroChat
RetroChat installs on site builders with the same one-line embed code shown above; the dedicated plugin is for WordPress, which has its own guide on adding live chat to WordPress. Your widget key and embed code are in the dashboard under Install. Under Install → Allowed websites, list every domain you use: the www. version is included automatically, *.yourdomain.com covers subdomains, and you can add a staging address. The chat loads in the background, and it's drawn in its own isolated layer, so your builder's styles can't break it and its styles can't affect your site.
Once it's live, match it to your brand under Widget: title, subtitle, launcher greeting, accent color, position and the label on the "Talk to a person" button. See Customize the widget. For the bigger picture (office hours, chatbot, team), see our guide to adding live chat to your website.
Get chat on your site in ten minutes
Copy the code, paste it into your builder's site-wide footer, publish and test. You can do it today with a free 14-day RetroChat trial, no credit card required.
Frequently asked questions
Can I add live chat to Wix without an app?
Yes. Wix lets you add third-party code site-wide under Settings → Custom Code, as long as your site is published and has a connected domain. Paste the chat's embed code there, choose all pages and Body – end, and apply.
Why doesn't my chat widget show in the Squarespace or Webflow editor?
Squarespace's documentation says custom code doesn't run in the editor's preview, and Webflow recommends checking custom code on the published site. Publish, then check the live version in a private browser window.
Which Squarespace plans support code injection?
Squarespace's help center lists Core, Plus, Advanced and some legacy plans. If you don't see the Code Injection panel, check your plan in your site's billing settings.
Will a chat widget slow down my site builder site?
A well-built widget loads asynchronously, so your page content doesn't wait for it. Install it once in the site-wide footer rather than on individual pages, and avoid stacking several chat or popup tools at once.