Skip to main content

Web Widget (Website)

The Web Widget is the primary channel for on-site customer engagement. It allows you to embed your AI agent directly into any website with a few lines of code.

1. Installation​

To install the widget, copy the following snippet into the <head> or before the closing </body> tag of your website:

<script 
  src="https://widget.texterz.ai/index.js" 
  data-widget-id="YOUR_WIDGET_ID"
  async
></script>

You can find your unique Widget ID in the Channels > Web Widget settings.

2. Configuration & Customization​

The widget can be fully customized to match your brand:

  • Branding: Upload a custom launcher icon and bot avatar.
  • Colors: Set the primary brand color for the chat bubble and header.
  • Initial State:
    • Welcome Message: The first message the bot sends when the chat is opened.
    • Starter Questions: Predefined buttons to help users start a conversation (e.g., "What are your prices?").
  • Launcher Style: Choose between a standard bubble, a square button, or a custom text launcher.

3. Whitelabeling​

For Pro and Enterprise agencies, the "Powered by Texterz" link can be removed or replaced with your own agency name and link.

4. Security & Domain Whitelisting​

To prevent unauthorized use of your widget ID, you should configure Allowed Domains:

  1. Go to Web Widget Settings > Security.
  2. Add the domains where the widget is allowed to run (e.g., example.com, app.example.com).
  3. Any request from an unlisted domain will be blocked.

5. Metadata & User Identification​

You can pass custom metadata from your website to the AI agent (e.g., user's name, subscription plan, or current page context) using the window.texterzSettings object:

window.texterzSettings = {
  user_id: "12345",
  name: "John Doe",
  plan: "Premium"
};

Need Help?​

Check the Troubleshooting Guide if the widget isn't appearing on your site.