Skip to main content

Embedded Widget

The BotDojo Embedded Chat Widget allows you to easily integrate a chat interface into your website. This chat interface connects users directly to your BotDojo Flow.

To integrate the BotDojo chat widget into your website, simply paste a script tag into your website's HTML. This script tag will add a button to your website that loads the chat widget into an iframe when clicked. To get the script, open any Compatible Chat Flow in the designer, then click Deploy. In the Chat Widget section, you can create a new widget and then copy the script to your clipboard.

The widget can be customized to match your specific needs:

  • Accent Color: Customize the chat widget's color scheme to align with your website’s design. This is controlled via the data-accent-color attribute. The value should be a valid CSS color, e.g., #4a3ed4.
  • Flow Release: You can specify which version of your Flow to use. This allows for targeted testing or consistent functionality with a particular Flow version. Set this using the data-flow-version attribute. Use values like default to select the default release, or a specific version number or alias, e.g. 1.2 or embedded-chat.
  • Welcome Message: Define a custom message that will greet users when they first load the chat widget. This creates a more engaging user experience right from the start.
  • Custom Error Message: If there are any issues with the chat widget, you can define a custom error message to provide users with clear guidance on the next steps. This could include a link to a support ticket system or other relevant resources.

Advanced Attributes​

The widget script supports several advanced attributes for further customization:

  • Bot Image: Set a custom avatar for the bot responses using data-bot-image attribute with an image URL
  • User Image: Set a custom avatar for user messages using data-user-image attribute with an image URL
  • New Session: Force starting a new chat session on widget load using data-new-session="true". By default, the widget remembers the user's previous chat session and continues from where they left off.