How to add Supadesk to Framer

Framer sites are fast and design-focused. This guide shows you how to add the Supadesk AI chat widget to Framer through Custom Code at the end of the <body> tag, which loads the widget on every published landing page, product page, and multi-page site route.

Before you start

In Supadesk, open your agent and click Chat Widget.
Click Copy Embed Code.
(Recommended) Add your Framer site URL to Allowed Origins — e.g. https://yoursite.com or your framer.website domain.

Install on Framer

Open your Framer project.
Click the site name or gear icon to open Site Settings.
Go to General → Custom Code (or Custom Code directly, depending on your Framer version).
Find the field for End of <body> tag (or Body end).
Paste your Supadesk embed script.
Click Save and Publish your site.

Framer tip

Third-party scripts like Supadesk only run on the published site. The in-editor preview may not show the widget — always verify on your live URL after publishing.

Check it works

Open your published Framer site in a private browser window. The chat bubble should appear in the bottom-right corner.

Troubleshooting

Widget missing: Publish the site after saving custom code. Preview mode alone often skips external scripts.
Widget blocked: Add your exact published origin (including https://) to Allowed Origins in Supadesk.

FAQ

Where should I add Supadesk in Framer?

Add the Supadesk embed script in Framer Site Settings under Custom Code, using the End of body or Body end field. That placement loads the chat widget after the page content.

Does Supadesk show in Framer preview mode?

Framer preview mode may skip or restrict external scripts. Publish the site and test the live URL in a private browser window to confirm the Supadesk widget appears.

Do I need custom code on each Framer page?

No. Site-level Custom Code applies across the published Framer site, so one Supadesk script can cover all pages that share the same site settings.