Chatbot

How to integrate ChatBot with Webflow

There are three integration methods available: Embed the ChatBot widget is the fastest approach for adding chat to any Webflow site. Connect through Zapier offers a no-code solution for automating data flow between ChatBot and Webflow CMS.

For advanced use cases, Build with ChatBot APIs lets you create custom integrations using webhooks and API endpoints — though this requires external server infrastructure since Webflow doesn't support server-side code execution.

Embed the ChatBot widget

1. Copy embed code from ChatBot dashboard (Integrations > Chat Widget)
2. In Webflow: Project Settings > Custom Code > Footer Code section
3. Publish your site (widget won't appear in preview mode)

Customization options (via ChatBot dashboard — no republishing needed):

• Appearance: colors, position, avatar, welcome messages
• Language: automatic detection or manual selection
• Mobile: size, position, interaction patterns
• Welcome screens: custom greetings, logos, conditional logic

Build with ChatBot APIs

Requirements: External server infrastructure (Webflow has no server-side runtime). Consider using Webflow Cloud or a third-party hosting service.

Authentication: Bearer token from Developer Settings Dashboard. Store in environment variables.

Users API endpoints:

• GET /users?filter=email:john@example.com — List/search users
• GET /users/{userId} — Get user profile
• POST /users — Create user with custom attributes
• PUT /users/{userId} — Update profile
• DELETE /users/{userId} — Remove user

Webhooks

Send real-time chat data to your server. Requires HTTPS endpoint supporting GET (verification) and POST (events).

Payload includes: chat/message IDs, userId, externalId, user attributes (name, email, phone), custom attributes, node information.

Widget JavaScript API

Control widget via OpenWidget object: minimize(), maximize(), hide(), destroy(). Listen for ready event before calling methods.

Connect through Zapier

ChatBot's Zapier integration automates workflows between ChatBot conversations and Webflow CMS without custom code. Create Webflow CMS items from new ChatBot messages, update records based on chat interactions, or fulfill e-commerce orders triggered by chat events.

ChatBot provides two Zapier triggers. New Message fires when a message is received in ChatBot, and New Comment triggers when comments are added. These triggers connect to Webflow actions including Create Item for adding CMS entries, Update Live Item for modifying published content, and Fulfill Order for e-commerce workflows.

Build multi-step workflows by adding filter and action steps between the trigger and Webflow action. Enrich lead data, send notifications, or update multiple systems based on chat interactions. Zapier supports OAuth authentication for both ChatBot and Webflow connections.

What you can build

Integrating ChatBot with Webflow through widget embedding lets you create automated customer experiences that capture leads, provide instant support, and guide visitors through conversion funnels.

• Automated product support sites: Build e-commerce stores with chatbot-powered customer support for product information and common service inquiries
• Lead qualification landing pages: Create marketing sites that engage visitors and capture contact information through conversational interactions
• Membership portals with chat support: Develop gated content sites where chatbots provide automated responses to member questions
• Multi-language support centers: Deploy knowledge base sites with chatbot automation that handles customer inquiries across multiple languages