Add Hazelchat to your Softr site
What you need
- A Softr app on the Pro plan or higher. Softr offers custom code from Pro upwards.
- A page visitors can open without signing in, such as your home page, so Hazelchat can find the code.
- 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 Softr, open Settings from the left toolbar and go to Custom Code.
- Paste the line into the footer field. Softr adds it before the end of every page and says the footer is meant for scripts.
- Save, then publish your app.
- 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 Softr’s own help (General settings and Custom code block overview), read on 14 October 2026. We have not yet tested Hazelchat on Softr ourselves. If a menu looks different, Softr’s page is the up-to-date one.
Check it works
- Open the published app signed out and view the page source: the line appears near the end.
- Hazelchat answers from the public content you approve. It does not see your app’s data or who is signed in.
Softr’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
- A home page behind a sign-in. Hazelchat’s check then sees only the sign-in page. Enter a public page under Installation troubleshooting → Page the script is on, or prove your website with a DNS record under Website settings.
- A custom code block instead. Softr’s custom code block puts code on one page. Use the app footer so the chat is on every page.
- “The install script was not found on the page.” Check that you published the change in Softr and that the line is complete, with your own key, then try again in Hazelchat.
Visitor consent
Softr has no cookie banner of its own. Its iubenda integration (Settings → Integrations) blocks common scripts until a visitor accepts; whether it blocks Hazelchat depends on your iubenda settings.
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
- Open Settings → Custom Code, delete the line from the footer, save and publish.
- 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 Softr itself, use Softr’s docs. For anything in Hazelchat, email hello@hazelchat.co. We answer within one business day. Other ways to install Hazelchat.