Widget Customization

Control the widget's appearance and behavior with data attributes on the script tag. No extra code required.

Data Attributes Reference

Add any of the following attributes to your embed script tag to customize the widget.

AttributeValuesDefaultDescription
data-theme"light" | "dark""light"Widget color theme
data-position"bottom-right" | "bottom-left" | "top-right" | "top-left""bottom-right"Widget placement on the page
data-display-textAny stringnoneText label shown next to the chat bubble

Full Example

Here is a script tag with all customization attributes applied together:

your-website.html
<script
  src="https://www.botembed.ai/widget.js?botId=YOUR_BOT_ID"
  data-theme="dark"
  data-position="bottom-left"
  data-display-text="Need help?"
></script>

Replace YOUR_BOT_ID with your actual bot ID from the dashboard.

Ready to add AI chat to your site?

Create your first bot in under 30 seconds. No credit card required.

Widget Customization | BotEmbed.ai | BotEmbed.ai