How can we help you?

Chat Window Designer — Launcher & Footer Customization

Overview

The Chat Window Designer (Messaging → Chat Window in the admin portal) lets you customize how your chat launcher button and widget footer look on your website, without writing any code. Changes preview live and apply immediately once saved.

Launcher icon styles

Under Appearance → Launcher Customization, you can choose the icon shown on your chat launcher button:

  • Default chat bubble
  • Message
  • Robot
  • Star
  • Thumbs Up
  • Phone
  • Heart
  • Custom (upload your own image)

Each option shows a live preview so you can compare styles before saving.

Launcher shape

Choose from Circle, Rounded, or Square for the launcher button's overall shape. The preview shows each shape at its actual proportions so Circle and Rounded are easy to tell apart before you pick.

Adjustable icon line thickness

When using the Default icon style, a Line Thickness slider appears, letting you make the icon's stroke thinner or thicker to match your brand's visual weight. This option is specific to the default icon — custom-uploaded icons use their own artwork as-is.

Footer & social links

Under Appearance → Footer, you can add links to your social media profiles that appear in the chat widget's footer:

  • Facebook, X (Twitter), LinkedIn
  • Instagram, YouTube, TikTok
  • One additional custom platform with your own label and URL

If you type a URL without https:// (e.g. facebook.com/yourpage), it's automatically corrected when you click away from the field — you don't need to type the full https:// prefix yourself.

Troubleshooting

My new social icon isn't showing up — make sure a URL is actually entered in that field; empty fields are hidden from the live widget automatically.

The launcher preview doesn't match what visitors see — click into the field or refresh the Designer page; the preview updates live as you change settings, but a stale browser tab may need a refresh to pick up the latest icon set.

Read receipt styles

Appearance > Conversation > Read Receipts sets what shows under the visitor's own messages (readReceiptStyle in the chat window style config). Options:

Value What the visitor sees
ticks Single check, then double check, then colored double check once an agent has read it
singleTick One check once sent; never shows read
seen Nothing until read, then a colored double check
text "Sent", "Delivered", "Read" labels
textWithTick Label plus a small tick
dot Small dot, colored once read
thickTick Same progression as ticks with heavy-weight checks
doubleThick Heavy single check when sent, heavy double check from delivered, colored on read
sentOnly The word "Sent" only; never reveals delivered or read
none No receipt

The label wording ("Sent", "Delivered", "Read") is editable in the Language settings. You can also set readReceiptStyle through the Velaro MCP, CLI or Moshky when updating the chat window appearance. Timestamps are centered above each message at every screen width.

Share: Email

Was this article helpful?