Before you start
Copy your embed code from Dashboard → Widget → Install & security. It has your own site key filled in and looks like this:
<script src="https://api.apexbot.eu/widget.js" data-site-key="apex_pk_…" async></script>Webflow runs custom code only on sites with a paid site plan.
Add it to every page
- Open your project's Site settings and go to the Custom code tab.
- Paste the embed code into Footer code (the box for code before the
</body>tag). - Click Save changes, then publish your site. Custom code only runs on the published site, not in the Designer.
Or to a single page
To show the chat on one page only, open that page's settings in the Designer and paste the snippet into Custom code → Before </body> tag, then publish. To show it everywhere except a few pages, add it site wide and list the exceptions under Behavior → Hide on these pages in your Apex dashboard.
Allow your domains
Under Allowed websites add your custom domain, with and without www. To test on Webflow's staging address first, add https://your-site.webflow.io as well. The widget only runs on the addresses listed.
Good to know
- Knowledge. Add your published site as a knowledge source. Apex reads your sitemap and linked pages, including CMS collection pages, up to your page limit. Re-sync after you publish big changes.
- Styling. The widget renders in a Shadow DOM, so your Webflow styles can't break it. Colors, launcher and position are set in the Apex dashboard.
- Opening it from a button. Give a button an ID (for example
help) and add<script>document.getElementById("help").onclick = () => Apex.open()</script>after the embed code. See the JavaScript API.
If the launcher doesn't appear, see troubleshooting.