- HTML
- React
HTML
<ab-chat
chatbotID="YOUR-CHATBOT-ID"
theme="dark"
orientation="left"
color="#ff0000"
logoURL="https://example.com/logo.png"
headline="Chat with our AI"
description="Ask me anything, and I'll do my best to answer!"
initialMessage="Hello 👋 How can I help you today?"
initialMessagePopupDelay="5"
placeholder="Type your message here..."
newChatButtonText="Start a new chat"
backToChatButtonText="Back to chat"
faqButtonText="See FAQ"
ticketButtonText="Create a ticket"
hideButton="true"
policyDescription="Please accept our privacy policy to continue."
policyLinkTitle="Privacy Policy"
policyLinkURL="https://example.com/privacy-policy"
policyAcceptButtonText="Yes, got it"
dataCollectionMessage="Let's get your name and email so we can follow up with you"
dataCollectionNamePlaceholder="Your name"
dataCollectionEmailPlaceholder="Your email"
dataCollectionButtonText="Add information"
></ab-chat>
React
import { Chat } from '@aidbase/chat';
<Chat
chatbotID="YOUR-CHATBOT-ID"
theme="dark"
orientation="left"
color="#ff0000"
logoURL="https://example.com/logo.png"
headline="Chat with our AI"
description="Ask me anything, and I'll do my best to answer!"
initialMessage="Hello 👋 How can I help you today?"
initialMessagePopupDelay={5}
placeholder="Type your message here..."
newChatButtonText="Start a new chat"
backToChatButtonText="Back to chat"
faqButtonText="See FAQ"
ticketButtonText="Create a ticket"
hideButton
policyDescription="Please accept our privacy policy to continue."
policyLinkTitle="Privacy Policy"
policyLinkURL="https://example.com/privacy-policy"
policyAcceptButtonText="Yes, got it"
dataCollectionMessage="Let's get your name and email so we can follow up with you"
dataCollectionNamePlaceholder="Your name"
dataCollectionEmailPlaceholder="Your email"
dataCollectionButtonText="Add information"
/>
ab-chat or Chat element, this value will override the value in the Chatbot settings.
See all the available attributes in the Chatbot Reference.