Framer

Add chatbot embed code to Framer

Add the widget script in Framer custom code settings and run it on the pages where visitors need chat.

Framer

Before you start

Best for

Modern marketing sites, landing pages, product pages, startup sites, and campaign pages built in Framer.

Install location

Use Project Settings, Custom Code, Add Script, and choose the end of body location.

Framer snippet

<script
  src="https://your-domain.com/widget.js"
  data-workspace-id="WORKSPACE_ID"
  data-chatbot-id="CHATBOT_ID"
  defer
></script>

Install

1Copy the widget snippetOpen the chatbot Embed page and copy the final script.
2Open Custom CodeIn Framer, open Project Settings and choose Custom Code.
3Add a scriptCreate a script, give it a recognizable name, paste the widget snippet, and select the end of body location.
4Choose pages and publishApply it to all pages or selected pages, publish the project, and test the live site.

Access

Add the Framer custom domain.

Add the framer.app preview domain if you use it for testing.

Use the final production hostname before sending traffic.

Verify

If Framer runs the script more than once during navigation, switch the script run option and retest for duplicate launchers.

Place visual chat widgets at body end rather than the head.

Use selected pages when only a campaign or help page needs the chatbot.

Next doc

Deploy the widget through a Google Tag Manager Custom HTML tag when GTM is already installed on the website.