Customizing Your Widget
HelpFaster gives you full control over the look, feel, and behavior of your chat widget so it blends naturally into your website.
Colors and Branding
In the dashboard, open your chatbot and go to Widget > Appearance. You can set:
- Primary color — Controls the header, send button, and user message bubbles. Pick any hex value or use the color picker.
- Bot avatar — Upload a custom image or use one of the built-in robot mascots. The avatar appears next to every bot message.
- Widget title — The text shown in the header bar when the chat is open.
Changes are saved instantly and apply to all pages where the widget is embedded. No code changes required.
Persona and Tone
The persona setting tells the AI how to communicate. Navigate to Chatbot > Persona and write a short instruction, for example:
You are a friendly and professional support agent for Acme Corp. Keep answers concise. If you do not know the answer, say so honestly and offer to escalate.
The AI follows this instruction for every conversation. You can update it at any time without re-indexing your knowledge base.
Welcome Message
The welcome message is the first thing visitors see when they open the chat. Set it under Widget > Behavior. A good welcome message is short, helpful, and sets expectations:
- "Hi! I can answer questions about our products and pricing. Ask me anything."
- "Welcome to Acme support. How can I help you today?"
Leave the field empty to skip the welcome message and let the visitor start the conversation.
Quick Prompts
Quick prompts are pre-written suggestion chips displayed below the welcome message. They give visitors a fast way to start a conversation without typing. Add up to five prompts under Widget > Behavior, for example:
- "What are your pricing plans?"
- "How do I reset my password?"
- "Do you offer refunds?"
Visitors click a chip and the question is sent automatically. This reduces friction and guides users toward topics your knowledge base covers well.
Position and Display
- Floating mode — The widget appears as a small bubble in the corner of the page. Click to expand. Set the corner (bottom-right or bottom-left) in the dashboard or via the
data-positionattribute. - Inline mode — The widget renders inside a container element on your page. Useful for dedicated support pages or embedded help centers.
Mobile Behavior
On mobile screens the widget automatically expands to near full-screen when opened, providing a comfortable chat experience. The floating bubble shrinks slightly to stay out of the way of page content.
Testing Changes
After saving, open your website in a new tab (or hard-refresh) to see the updated widget. Changes propagate immediately — there is no build step or deploy required.