name

  • Type: string
  • Description: Custom name shown in the widget header
  • Example: "Shop Assistant", "Support Bot", "Tour Guide"

panelConfig

  • Type: object
  • Description: Configure the expanded panel appearance
panelConfig: {
  title: string,       // Title in expanded panel
  description: string, // Description text
  expanded: boolean    // Start with panel expanded
}

position

  • Type: object
  • Description: Configure widget positioning on the page
position: {
  alignment: string,  // Position preset
  margin: number,     // Distance from edges (px)
  offsetX: number,    // Horizontal offset (px)
  offsetY: number     // Vertical offset (px)
}
Available alignments:
  • Top: "top-left", "top-center", "top-right"
  • Middle: "center-left", "center", "center-right"
  • Bottom: "bottom-left", "bottom-center", "bottom-right"

Customization Examples

E-commerce Assistant

initUnifiedWidget({
  agentConfigId: "your-agent-id",
  agentKey: "your-agent-key",
  name: "Shop Assistant",
  panelConfig: {
    title: "Need Help Shopping?",
    description: "I can help you find products, compare prices, and guide you through checkout.",
    expanded: false
  },
  position: {
    alignment: "bottom-right",
    margin: 40
  }
});

Customer Support

initUnifiedWidget({
  agentConfigId: "your-agent-id",
  agentKey: "your-agent-key",
  name: "Support Bot",
  panelConfig: {
    title: "How Can We Help?",
    description: "I'm here to help with any questions about your account or orders.",
    expanded: true // Start open
  }
});

Product Tour Guide

initUnifiedWidget({
  agentConfigId: "your-agent-id",
  agentKey: "your-agent-key",
  name: "Tour Guide",
  panelConfig: {
    title: "Welcome to Our Platform",
    description: "I can walk you through our features, show you how to get started, and answer any questions.",
    expanded: false
  },
  position: {
    alignment: "center",
    offsetY: -50
  }
});

Best Practices

  1. Keep it Concise: Short, clear titles and descriptions work best
  2. Be Specific: Tailor the messaging to your specific use case
  3. Include Call-to-Action: Encourage users to interact with the assistant
  4. Match Your Brand: Use consistent naming and tone with your brand
  5. Test Different Messages: A/B test different titles and descriptions to see what resonates with users