The Widget
Toggle, Starters, and Styles
The final step in customizing your widget is defining how users open the chat and what they see the moment they arrive.
1. The Toggle Button (The Entry Point)
The Toggle is the small button users click to open the chat. You can customize its physical appearance to make it stand out:
- Size & Border: Adjust the diameter of the toggle and the thickness of its border.
- Icon: You can upload a custom Image or an SVG (like a chat bubble or your logo).
- Icon Size: Use a percentage to scale the icon so it sits perfectly inside the toggle button.
2. Conversation Starters
Don't wait for users to think of a question. Conversation Starters are predefined buttons that appear when a user first opens the widget.
You can add messages like "What are your prices?" or "Tell me about your services." When a user clicks one, the Agent answers instantly, reducing the friction of starting a chat.
3. Style Studios (Color & Font)
To finalize your design, use the Color Studio and Font Studio to match your website's exact theme:
- Color Studio: Change the primary colors for the header, buttons, and chat bubbles.
- Font Studio: Select a font that matches your brand's typography.
4. Get Link & QR Code
If you want to use your Agent somewhere other than your website, use the Get Link or Get QR Code tools. This generates a direct URL you can share in emails, social media bios, or printed materials to lead people directly to your AI.
What’s Next?
Congratulations! Your Agent is trained, healthy, and beautifully integrated. You are now ready to start scaling your customer support with Answerly.