Add Hazelchat to your Square Online site

Add Hazelchat’s chat agent to every page of your Square Online site with Square’s Tracking Tools. Hazelchat answers your visitors from the pages and documents you approved, and shows the sources under every answer.

What you need

A Square Online site. Square’s US help offers custom code on Free, Plus and Premium; its UK help names Plus and Premium only.
The account owner’s login, or a team member with online permissions.
A Hazelchat account with an agent you have tried in the workspace. You can start free.

Add the code

In Hazelchat, open the install step (Install in setup, or Website → Install on your website), choose Something else and click Copy the code. It is one line with your own widget key:
```
<script src="https://app.hazelchat.co/widget.js" data-agent="YOUR-WIDGET-KEY" defer></script>
```
In the Square Dashboard, go to Channels → Square Online, then Settings → Tracking Tools.
Click Add new code, name it Hazelchat and paste the line.
Choose head as the placement and click Save.
Publish your site from the site editor.
Back in Hazelchat, enter your website’s address and click I’ve added the code.
Click Publish and switch on (or Switch on if your agent is already published). Hazelchat first looks for the code on your website and only then makes the chat visible.
Open your website, refresh it, ask the chat a question a visitor would ask, then return to Hazelchat and click Yes, I saw this answer.

These steps follow Square Online’s own help (Add custom tracking code to your website and Add a cookie banner to Square Online), read on 14 October 2026. We have not yet tested Hazelchat on Square Online ourselves. If a menu looks different, Square Online’s page is the up-to-date one.

Check it works

Open the published site and view the page source: the Hazelchat line sits in the head of the page.
Hazelchat’s line ends with defer, so the chat starts after the page has loaded, even from the head. Square calls this section tracking code; the line itself shows nothing but the chat button.

Square Online’s help says this code goes into the page itself, so Hazelchat’s check can find it when you switch the chat on. If your home page does not carry the code, enter the page that does under Installation troubleshooting → Page the script is on.

Common problems

An Embed code section instead. Square draws those sections in the visitor’s browser, so Hazelchat’s check cannot find the code there, and the chat would be tied to one place on one page. Use Tracking Tools.
Not published. Square shows the change only after you publish from the site editor.
Weebly is a different product. If you edit your site in the Weebly editor, follow the Weebly guide.
“The install script was not found on the page.” Check that you published the change in Square Online and that the line is complete, with your own key, then try again in Hazelchat.

Square Online can show a cookie banner (Website → Site preferences → Cookie Consent), with your own banner code or Cookiebot. Square’s help does not say whether either holds back code from Tracking Tools, so test it on your published site.

To keep the chat closed until a visitor agrees, add data-require-consent="true" to the line, before defer. The chat then waits until your consent tool sends:

window.dispatchEvent(new CustomEvent('hazelchat-consent', { detail: true }));

Send detail: false when a visitor withdraws consent. With this option and no event, no chat appears, so test it on your published site.

Remove Hazelchat

In Settings → Tracking Tools, delete the Hazelchat code, then publish your site again.
To hide the chat everywhere at once without touching your site, switch Hazelchat off on its Website page. The line then stays on your pages but shows nothing.

Help

For Square Online itself, use Square’s Support Center. For anything in Hazelchat, email hello@hazelchat.co. We answer within one business day. Other ways to install Hazelchat.

Start free