IntegrationsWebflow
Add an Embedded AI Chat to your Webflow site
What is Webflow
Webflow is a visual web development platform that enables users to design, build, and launch websites without the need for coding.
Get an API key
- Go to the Inkeep Dashboard
- Select your project under Projects
- Go to the Integrations tab
- Click on Create integration
- Select Web
- Provide a Name.
- Specify a URL for where this integration will be used.
- For production API keys, leave Enforce referrer URL checked.
- Click on Create
- Click the Example < /> button to get your API key and view suggested settings
For local or staging API keys, see here.
Connect the script
- Navigate to Site settings (not the designer)
- Open the Custom code tab
- Add the below to the Head code section
Create a new page
Next, you need to create a new page for the chat widget. You can do this using the built-in Webflow designer.
![](/images/webflow/webflow-create-new-page.png)
Add a container to the page
Select Container from the list of elements and add it to the page:
![](/images/webflow/webflow-create-chat-container.png)
Set the container ID
Set the ID of the container to inkeepEmbeddedChat
:
![](/images/webflow/webflow-set-chat-container-ID.png)
Configure the widget
Go back to Site settings and navigate to Custom code. Add the below in the Footer code section.
Press Save to apply your settings.
As a result, a chat widget will be added to the Ask AI page:
![](/images/webflow/webflow-chat-example.png)
For a full list of customizations, check out the Common Settings.