Widget Studio
Embedding the Widget
Last Updated: June 15, 2026Embedding the Widget Once your AI agent is configured, you can add it to your website using the widget embed code. Generate Embed Code Open your AI Agent Dashboard. Select the desired AI Agent. Navigate to Widget Studio. Open Embed Settings. Copy the generated widget code. Install on WordPress Log in to WordPress Admin. Open Appearance → Theme File Editor or use a Header/Footer plugin. Paste the widget code before the closing tag. Save changes. The chatbot should now appear on your website. Install on HTML Websites Paste the widget code directly before the closing: </body> tag. Install Using Google Tag Manager You may also deploy the widget through Google Tag Manager. Create a Custom HTML Tag. Paste the widget code. Trigger on All Pages. Publish changes. Verify Installation After installation: Refresh your website. Confirm the launcher appears. Start a test conversation. Verify responses are working correctly. Troubleshooting Widget Not Appearing Possible causes: Incorrect embed placement Caching issues JavaScript conflicts Solutions: Clear website cache Reinstall embed code Disable conflicting plugins temporarily Need Help? If you continue experiencing installation issues, contact: support@chatshiftai.com
Custom Branding
Last Updated: June 15, 2026Custom Branding Your chatbot should feel like part of your business. AIChatAgent provides branding tools that help you create a fully customized customer experience. Customize Colors Adjust widget colors to match your brand identity. Common branding elements include: Primary Color Secondary Color Background Color Text Color Upload a Logo You can upload your business logo to appear inside the chat widget. Recommended formats: PNG JPG SVG Agent Name Customize your AI assistant name. Examples: Support Assistant Store Expert Sales Agent Help Desk Agent Avatar Choose an avatar that represents your business. Options may include: Company logo Custom image AI avatar Premium 3D avatar Welcome Message Create a personalized greeting. Examples: “Welcome to our store! How can I help?” “Need help finding the perfect product?” “Our team is here 24/7.” Branding Best Practices Keep branding consistent with your website. Use recognizable company assets. Maintain professional design standards. Preview changes before publishing.
Voice Input & Text-to-Speech
Last Updated: June 15, 2026Voice Input & Text-to-Speech AIChatAgent includes accessibility features that allow users to interact with your chatbot using voice. Voice Input Voice Input allows visitors to speak instead of typing. When enabled: Users click the microphone icon. Speak their question. The message is automatically converted to text. The AI responds normally. Benefits Faster interactions Improved accessibility Better mobile experience Hands-free communication Enable Voice Input Open Widget Studio. Navigate to Accessibility Settings. Enable Voice Input. Save changes. Text-to-Speech (TTS) Text-to-Speech allows the chatbot to read responses aloud. Visitors can listen to AI responses instead of reading them. Benefits Accessibility support Enhanced user experience Improved engagement Better support for visually impaired users Enable Text-to-Speech Open Widget Studio. Navigate to Accessibility Settings. Enable Audio Output. Save changes. Best Practices Use voice features on support-heavy websites. Test audio playback on multiple devices. Ensure responses remain concise and easy to understand.
Widget Launcher Settings
Last Updated: June 15, 2026Widget Launcher Settings The Widget Launcher is the button visitors click to open your AI chatbot. AIChatAgent allows you to customize the launcher to increase visibility and improve engagement. Launcher Types Available launcher styles may include: Circle Square Pill Choose the style that best matches your website design. Custom Icons You may customize the launcher using: Default icons Brand icons Custom images Premium 3D icons Launcher Position The widget can typically be displayed in: Bottom Right Bottom Left Most businesses use the bottom-right position. Attention-Grabbing Animations Available animations may include: Pulse Wiggle Bounce Glow Animations help attract visitor attention and increase engagement. Custom Welcome Messages Examples: “👋 Hi! How can we help today?” “Need help choosing the right product?” “Ask us anything about our services.” Welcome messages can encourage visitors to start conversations. Best Practices Keep launcher text short. Avoid distracting animations. Use branding-consistent icons. Test visibility on mobile devices.
Widget Themes
Last Updated: June 15, 2026Widget Themes Widget Themes allow you to customize the appearance of your AI chatbot to match your brand and website design. AIChatAgent includes multiple professionally designed themes that can be applied with a single click. Available Themes Depending on your plan and current release, available themes may include: Modern Glass Cyber Minimal Messenger Compact Gradient Sharp Depth Dark Mode Neumorphic Playful Changing a Theme Open your AI Agent Dashboard. Select your AI Agent. Navigate to Widget Studio. Open the Themes section. Select your preferred theme. Save your changes. The widget preview will update instantly. Choosing the Right Theme Business Websites Recommended: Modern Minimal Glass E-Commerce Stores Recommended: Messenger Gradient Modern Technology Brands Recommended: Cyber Dark Mode Glass Creative Businesses Recommended: Playful Gradient Neumorphic Theme Best Practices Match your website colors. Maintain readability. Avoid excessive visual effects. Test on desktop and mobile devices. Preview Before Publishing Always preview your widget before publishing to ensure it matches your website design and branding.