Webflow
Embed your ioZen intake bot on a Webflow site using custom code embeds.
Add your ioZen intake bot to Webflow using the Custom Code embed element or site-wide custom code settings.
Recommended Embed Type
Widget for site-wide availability. Inline for embedding on a specific page section.
Option 1: Widget (Site-Wide)
- Go to Site Settings → Custom Code
- In the Footer Code section, paste:
<!-- ioZen Floating Widget -->
<script
src="https://app.iozen.ai/widget/v2/loader.js?bot=YOUR_BOT_SLUG"
data-bot="YOUR_BOT_SLUG"
async
></script>- Save and publish
Option 2: Inline (Specific Page)
- Open the Webflow Designer on the target page
- Add an Embed element (from the Add Elements panel → Components)
- Paste the inline code:
<!-- ioZen Inline Embed -->
<div
data-iozen-inline="YOUR_BOT_SLUG"
style="width: 100%; height: 100%; min-height: 600px; display: flex; flex-direction: column;"
></div>
<script
src="https://app.iozen.ai/widget/v2/loader.js?bot=YOUR_BOT_SLUG"
data-bot="YOUR_BOT_SLUG"
data-type="inline"
async
></script>- Close the code editor, position the embed element, and publish
Troubleshooting
| Issue | Solution |
|---|---|
| Embed doesn't render in Designer | Custom code only executes on the published site, not in the Webflow Designer |
| Bot loads but overlaps other elements | Set a fixed height on a parent div wrapping the embed |
Need help? Email us at hello@iozen.ai.