Skip to main content
IperChat
IT
Log in

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.

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 shows only the icon, hiding the message.

The position (bottom-right / bottom-left / inline) is set in the HTML snippet via data-position, not from the panel.

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”).

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 agent automatically detects the visitor’s browser language and responds in that language. Nothing to activate.

If you want to force a specific language (e.g. Italian only), add data-language="it" to the snippet:

<script
  src="https://widget.iperchat.ai/iperchat.iife.js"
  data-iperchat-auto-init
  data-tenant-id="YOUR_TENANT_ID"
  data-language="it"
></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.

Next steps