> ## Documentation Index
> Fetch the complete documentation index at: https://chatbase.co/docs/llms.txt
> Use this file to discover all available pages before exploring further.

# Connect

> This section in the AI agent shows how you can integrate the bot with your website, or even add it as an integration to Messenger or WhatsApp or many more!

### Embed

To embed your Agent into your website or application, first you need to enable your Agent.

<Frame>
  <img src="https://mintcdn.com/chatbase/8UJvGeL1-PrFP--v/user-guides/chatbot/images/settings/settings-24.png?fit=max&auto=format&n=8UJvGeL1-PrFP--v&q=85&s=930b80e55f7138da9e1b8480f3bc656c" alt="Playground Compare" width="2052" height="348" data-path="user-guides/chatbot/images/settings/settings-24.png" />
</Frame>

Now we have two main ways of embedding the AI agent to your website, the iframe or the widget.

<Frame>
  <img src="https://mintcdn.com/chatbase/8UJvGeL1-PrFP--v/user-guides/chatbot/images/settings/settings-25.png?fit=max&auto=format&n=8UJvGeL1-PrFP--v&q=85&s=b2dc97be993823b678df3cf778778779" alt="Playground Compare" width="2054" height="1544" data-path="user-guides/chatbot/images/settings/settings-25.png" />
</Frame>

The iframe adds a static component to your website which has the chat interface. This iframe cant be minimized or closed.

The widget adds a bubble icon to the bottom right corner of your website. When you press this button a chat window will appear and you can use it to send messages to your bot and you can press the same button again to minimize the chat window once again.

<Frame>
  <img src="https://mintcdn.com/chatbase/8UJvGeL1-PrFP--v/user-guides/chatbot/images/settings/settings-26.1.png?fit=max&auto=format&n=8UJvGeL1-PrFP--v&q=85&s=bb75e5bc30f055be8fb05755acac4dfc" alt="Playground Compare" width="1722" height="1012" data-path="user-guides/chatbot/images/settings/settings-26.1.png" />
</Frame>

### Configuration - Widget/Chat Bubble

First you will need to copy the script and add it to your website or app.

<Frame>
  <img src="https://mintcdn.com/chatbase/8UJvGeL1-PrFP--v/user-guides/chatbot/images/settings/settings-27.png?fit=max&auto=format&n=8UJvGeL1-PrFP--v&q=85&s=ce88f09e22199d073a6e178665fbce93" alt="Playground Compare" width="2054" height="536" data-path="user-guides/chatbot/images/settings/settings-27.png" />
</Frame>

Next for Identify Verfication of your users when they interact with your Agent, you need to generate an HMAC on your server for each logged-in user and send it to Chatbase.

You'll need your secret key to add identity verification to your site or app.

<Frame>
  <img src="https://mintcdn.com/chatbase/8UJvGeL1-PrFP--v/user-guides/chatbot/images/settings/settings-28.png?fit=max&auto=format&n=8UJvGeL1-PrFP--v&q=85&s=4061191a699f34b9802e3d4bdf603df5" alt="Playground Compare" width="2054" height="982" data-path="user-guides/chatbot/images/settings/settings-28.png" />
</Frame>

Go here for the [full documentation](/developer-guides/identity-verificatio).

### Share

This tab allows you to find a url for the iframe of the bot, showing a full screen of the AI agent in case you would like to send it for your colleagues to test or even use the bot! 

<Frame>
  <img src="https://mintcdn.com/chatbase/8UJvGeL1-PrFP--v/user-guides/chatbot/images/settings/settings-29.1.png?fit=max&auto=format&n=8UJvGeL1-PrFP--v&q=85&s=2e0dbc0b8f57a6937f0ae0dee6e0e30c" alt="Playground Compare" width="1746" height="680" data-path="user-guides/chatbot/images/settings/settings-29.1.png" />
</Frame>

Note: This link is generated using the Custom domains if it was configured. If not, it will be the base url for the iframe.
