The widget
Customize colors, greeting, and button
Adapt the widget to your brand: colors, logo, welcome message, suggested questions. All changes are live.
All widget customization is done from the ops panel, “Agent Configurations” section (side menu → Agents group). Click on the row corresponding to your Origin ID to open the configuration: appearance settings are grouped under “Appearance” → “Configuration”.
Changes are live: as soon as you save, any page loading the script sees the new version (within 60 seconds of cache).
Colors
Subsection “Brand colors”. Two values, both in hex format (#RRGGBB):
- Primary color — background of agent messages, chat header, floating button. Use your main brand color.
- Secondary color — accents, hover, links. Often a darker variant of the primary, or a complementary color.
The Live Preview at the bottom of the configuration updates as you type.
Identity: name, subtitle, and logo
Subsection “Identity”. The fields are:
- Name — appears in the chat header. Examples: “Smith & Co. AI”, “Acme Assistant”, “Sarah at The Corner Bakery”.
- Subtitle — one line below the name, configurable per language. Typically the specialization: “Here to help”, “Available 24/7”.
- Agent Name — the title of the standalone page / digital business card. Leave empty to reuse the Name.
- Logo URL — public URL of a PNG or SVG image (recommended 32×32, 64×64, or 128×128 px). Appears in the widget header.
Initial messages and suggested questions
Subsection “Conversation start”.
Initial messages
The message the visitor sees when they open the chat for the first time. In the form you’ll find “Initial messages”: one message per language (the language code is normalized to lowercase). Use “Add language” to add more, or “Restore IT/EN defaults” to fall back to base texts.
Hi! I'm Sarah, the assistant at The Corner Bakery.
I can help with menu, bookings and opening hours. What are you looking for?
Best practices:
- Be specific: explain what the agent can do. “I can help you with X, Y, Z” works better than “How can I help you?”.
- Mention an action: “Try asking me about opening hours” lowers the barrier to engagement.
- Consistent personality: the initial message sets the tone for the whole conversation.
Suggested questions
Below the initial message you can show clickable chips of ready-made questions (up to 6 per language, one per line). If the visitor clicks one, the question is sent to the agent immediately.
What are your hours?
Can I book for tonight?
Do you have gluten-free options?
Good suggested questions:
- Short — they must fit in a chip (max 6-8 words).
- Frequent — the ones you hear every day.
- Cross-cutting — answer something the site doesn’t make obvious.
Floating button
Subsection “Floating button” — covers how the widget looks when closed.
- Closed widget message — text that appears next to the icon on the floating button (e.g. “I’m here if you need help”).
- Show icon only (no text) — toggle: if active, the button is a round button with only the chat icon, and the message is hidden. Screen readers still announce the message.
The position (bottom-right / bottom-left / inline) is set in the HTML snippet via data-position, not from the panel.
Icon only or icon with text
New configurations start with Show icon only (no text) turned on: the closed widget is a compact round button with the chat icon. If you’d rather show a message next to the icon:
- Open the configuration and go to “Appearance” → “Configuration” → “Floating button”.
- Turn off Show icon only (no text).
- Optionally fill in Closed widget message, one per language. If you leave it empty, the widget uses a default text.
- Save. The button changes within 60 seconds.
You can switch back to the round button at any time by turning the toggle on again. Configurations created before this default was introduced keep the button they already had.
Chat text
Subsection “Chat text”.
- Chat input placeholder — the grey text shown in the input field before the user starts typing (e.g. “Write a message…”).
- Footer disclaimer — free text below the input field, useful in regulated sectors (“Answers do not replace medical advice”).
Legal links
Subsection “Legal links”. If filled in, the links appear in the widget footer; if empty, they’re not shown.
- Privacy Policy link — URL of your privacy page (e.g.
https://yoursite.com/privacy). - Terms of service link — URL of your terms page.
For healthcare, legal, or financial services, also consider filling in the Footer disclaimer under Chat text.
Languages
The widget’s buttons, messages and greeting use the language in data-language: it, en or es. Without it, the widget is in Italian. With data-language="auto", it follows the visitor’s browser (Italian, English or Spanish, otherwise English). Whatever the widget language, the agent replies in the language the visitor writes in.
For example, to show the widget in English:
<script
src="https://widget.iperchat.ai/iperchat.iife.js"
data-iperchat-auto-init
data-tenant-id="YOUR_TENANT_ID"
data-language="en"
></script>
Voice playback (TTS)
Subsection “Voice playback” (on the same Configuration page, below the widget sections). When enabled, every agent reply gets a “play” button that reads it aloud. Voice, tone, and pace are adjustable from the UI; you can test the result before saving.