Hazelchat for Framer

Give visitors a place to ask about your business. The plugin adds your Hazelchat agent to your published Framer site; your content and agent settings stay in Hazelchat.

What you need

A Hazelchat account and content you have approved for your agent. Prepare the content, check your details and try the agent in Hazelchat.
A Framer project where you can edit Custom Code and publish the site. Framer controls those permissions and may require a paid Site plan. Free Framer-plan compatibility has not been confirmed.
Your public widget key. Use only the 64-character data-agent value from Hazelchat's installation instructions, never an account password or API secret.

Add Hazelchat to your site

In Hazelchat, finish preparing your agent and enter your business name, privacy notice and contact details. Open Website, then Install on your website, and copy the public data-agent value from the script.
Open the Hazelchat plugin in Framer. Paste the value into Public widget key and read the hosted-service disclosure. If you installed Hazelchat manually before, remove that earlier snippet yourself to avoid duplicate installs.
The visitor-consent option starts on. Connect your consent manager as described below. Accept the hosted-service disclosure, then choose Add to Framer site.
Publish your site in Framer. Saving the plugin's code does not publish the site or the Hazelchat agent. Review any other unpublished changes before publishing.
Back in Hazelchat, review the saved website and click Publish and switch on (or Switch on Hazelchat for an unchanged published agent). Hazelchat checks before activation. Refresh your website, then complete Test on your website: ask a real question through the installed chat and confirm the answer in Hazelchat.

Test on the published website. The Framer editor and its preview are not evidence that visitors can use your chat. Set up and verify each published address you use, including a custom domain and a Framer-hosted address.

Wait for visitor consent before loading the chat frame keeps the chat closed until your consent manager sends Hazelchat's event. The launcher script still downloads before consent. The plugin does not provide a consent banner or connect to one automatically.

After the launcher script has loaded, your consent manager must send:

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

Send this after each fresh page load when a returning visitor has already given permission. An event sent before the launcher loads is lost. On withdrawal, send the same event with detail: false to remove the chat frame.

If your policy requires blocking even the initial script download, use your consent manager's script-blocking feature and test it on the published site. Turn the option off only if your site's policy permits loading the chat without that event.

With the option on and no consent event, no chat appears. Ask whoever manages your site's consent setup to connect and test it before launch.

Change or remove the widget

New public key or consent setting: reopen the plugin, update the field or option, accept the disclosure and choose Replace widget settings. Publish in Framer, then check installation again in Hazelchat.
Remove: choose Remove Hazelchat code, then confirm with Remove code. Publish in Framer to remove it from newly loaded pages.
Stop answers immediately: pause the agent in Hazelchat. Already open pages can retain the chat until reloaded.
Uninstall: remove the code and publish before uninstalling the plugin. Do not assume uninstalling alone removes published code.

The plugin manages only its own script. If you disabled that code in Framer settings, re-enable it there yourself and refresh the plugin's status. If its saved code was edited outside the plugin, review it in Custom Code settings first.

If the chat does not appear

Publish your latest Framer code, then load the published page again.
Refresh the plugin's status and check whether its code is disabled or your editing permissions have changed.
Check that the consent event arrives after the launcher loads.
In Hazelchat, confirm the correct website is allowed and verified, your agent has published content, and the agent is enabled.
If Framer's bottom-right badge overlaps the launcher, set Hazelchat → Website → Appearance → Floating bubble position → Left, save and publish in Hazelchat. Leave Framer's badge intact.
If you manage a Content-Security-Policy, allow https://app.hazelchat.co in script-src and frame-src. Keep your other protections in place.

Service, privacy and pricing

The plugin has no separate charge. Hazelchat offers an ongoing Free plan and optional paid plans; see pricing for current allowances. Framer's own plan requirements are separate.

Published pages download https://app.hazelchat.co/widget.js. Hazelchat can update that launcher without a plugin update. It loads the hosted chat frame, where questions and optional enquiries are processed by Hazelchat and its disclosed providers.

The plugin reads no Framer pages, CMS content or visitor records. It stores no Hazelchat login and does not import content, publish your site or enable your agent. See the privacy notice, terms and data processing agreement.

Get help

Email hello@hazelchat.co with your public website address and the wording of the error. Never send a password, private account token or model API key.