Installation steps
- 1
Prepare
Copy the MivoChat loader from your Install page and keep the public site key for the Framer domain.
- 2
Configure
Open Site Settings → General → Custom Code and use End of <body> tag. If the label has moved, check Framer's current custom code setting rather than adding it to a page text block.
<script src="https://mivochat.app/widget.js" data-site="YOUR_SITE_KEY" async></script> - 3
Publish
Save and publish the project to the same hostname visitors use, then allow that HTTPS origin in MivoChat.
- 4
Verify
Open the published site outside the editor preview and test a question answered by pricing or help content, then test a human handoff.
Use the site-level body field
Framer's project-level custom code is the right place for a loader intended across routes. Put the complete tag in End of <body> tag; do not paste it into a visual text layer, where it would display as text instead of loading JavaScript.
Framer interface labels can change. If Site Settings → General → Custom Code is not visible, confirm the current location and plan support in Framer before editing a component. Use one site-level loader rather than copying it into each page.
<script src="https://mivochat.app/widget.js" data-site="YOUR_SITE_KEY" async></script>Preview and publish are different
A canvas preview does not prove that a script is present on the public page. Publish first, view the live source for widget.js, then check DevTools if the launcher does not appear.
Framer can publish a staging subdomain and a custom domain. Add each origin you test to Allowed websites and retest after publishing changes; the allowed origin must match the browser's scheme and hostname.
Before you change the setup
- Who this is for
- a Framer site owner adding a support assistant to public SaaS pages
- What you need
- Framer site settings access, the public site key, and the published domain
- Where it goes
- Site Settings → General → Custom Code → End of <body> tag, if that field is present in the current editor
- Watch out for
- Framer canvas previews do not confirm public script execution; use a published hostname
Test the support boundary
- Does a pricing question point to the live pricing page?
- Does a teammate reply reach the browser widget?
- Does the published source contain only one loader?
Frequently asked questions
The custom code menu is missing
Check current Framer documentation, your site role, and whether the setting moved; do not paste JavaScript into a visual text layer.
The loader appears only on the canvas
Publish to the intended staging or custom domain and inspect that public URL, not the editor preview.
A domain is rejected
Add the exact HTTPS origin visitors use in MivoChat Allowed websites; staging and custom domains are separate origins.
The script is present but chat does not open
Check DevTools Network and Console for CSP, consent, or blocked configuration requests before moving the script.
Keep exploring
The r3-final-a evaluation measured 95% answerability-tier accuracy on 224 questions; this is an evaluation result, not a guarantee. AI replies use Anthropic. See the method and results and subprocessors and data locations.