Prepare the component
Framer’s embed guide supports a URL or HTML containing an embed script. From Insert, search for Embed and place the component on the canvas. Set aside a suitable test page without adding an unverified Threetone URL.1
Design the space
Give the interface enough width and height for its expanded state, errors, and controls. Review each breakpoint. Avoid placing it where it obscures navigation or the page’s primary action.
2
Check the integration contract
When a widget is released, confirm whether it supports Framer’s Embed context and whether it expects a URL or a script. Review allowed origins, frame restrictions, session access, and microphone permissions if voice is supported. A host that disallows framing cannot be made embeddable by changing a Framer layout setting.
3
Validate the published site
Add only the verified integration on the test page, then inspect the published domain. Test keyboard entry and exit, mobile sizing, navigation, permission denial, and ending a session. Preview rendering alone is not proof of a working conversation.
Before wider placement
Confirm there is one interface per intended page, no credentials in public code, and no persistent audio after leaving the page. Keep a contact link outside the embed so visitors have an alternative if it cannot load. Retain the prior page version for rollback. Review widget preparation for release evidence and authentication for agent access.Frequently asked questions
Why does an HTTPS URL still show a blank frame?
Why does an HTTPS URL still show a blank frame?
The destination may forbid framing, or the integration may need a different installation mechanism. Verify the released widget contract and browser error before changing site policy.
Can I add a workspace API key to the HTML field?
Can I add a workspace API key to the HTML field?
No. Public embed code is visible to visitors. Use only the session-access mechanism documented for the released widget.