Skip to content

Custom Widget Configuration

AyTech Solution edited this page Jun 26, 2026 · 1 revision

Custom Widget Configuration Guide

Botub AI widget poori tarah se dynamic hai. Aap bina code badle ek structured JSON Object ke through widget ka behavior, appearance, aur context badal sakte hain.

πŸ“Š Configuration JSON Schema Matrix

Niche diye gaye schema configuration ko use karke aap widget ko customize kar sakte hain:

{
  "widgetId": "botub-default-widget",
  "theme": {
    "primaryColor": "#00FFCC",
    "backgroundColor": "#0d1117",
    "textColor": "#c9d1d9",
    "fontSize": "16px"
  },
  "botProfile": {
    "name": "Botub Smart Assistant",
    "avatarUrl": "[https://example.com/bot-avatar.png](https://example.com/bot-avatar.png)",
    "welcomeMessage": "Hello! Main AyTech Solution ka smart bot hoon. Main aapki kya madad kar sakta hoon?"
  },
  "behavior": {
    "typingDelay": 1000,
    "allowUserFeedback": true,
    "rememberSession": true
  }
}

### βš™οΈ Integration Injection
Is JSON structure ko pass karke widget ko inject karne ka standard structural flow:

import { BotubWidget } from 'botub-ai-core';

// Initializing the component stream
BotubWidget.init({
  configSource: "./widget-config.json",
  renderTarget: "#botub-chat-root"
});