Once Smartsupp chat is installed on your website, the first thing you'll likely want to do is set up how the chat box looks and behaves. The Smartsupp chat box combines a chat and a contact form in a single widget, so visitors can send messages and — if you enable the contact form — share details like their name and email.
💡 Where to find it: All the options below live in Settings > Channels > Live chat in your Smartsupp dashboard.
In this article:
What you can customize
In the chat box appearance settings you can adjust the following so the widget fits your website:
Setting | What it does |
Color gradient | Sets the colors of the chat box to match your brand. |
Position | Places the chat box on the left or right side of the screen. |
General texts | Edits the labels and messages shown in the chat box. |
Theme | Switches the overall look of the chat box. |
Header Style | Switches between Compact and Standard header. Compact reduces the header height for a cleaner, more content-focused widget; Standard keeps the larger header, better suited to live chat with multiple operators. |
Chat box language | Sets the language of the chat box texts shown to your visitors. For details, see Chat box languages. |
🟡 Good to know: Widgets created from June 17, 2026 use the Compact header by default. Widgets created earlier stay on Standard for backward compatibility — you can switch between the two anytime in your chat box appearance settings.
Change the chat box position
You can move the chat button directly from the dashboard — no code required:
Log in to your Smartsupp account.
Go to Settings > Channels > Live chat > Appearance.
Adjust the placement — choose the left or right side of the screen, set a vertical offset, and set the spacing from the edges.
Save your changes. The updated position applies to your website automatically.
💡 Advanced: Developers can control the chat box position precisely via the JavaScript API — see Advanced: chat box position via the JavaScript API.
Note — agent photo & chat box avatar: The photo visitors see in the chat box is the agent's profile photo; it can't be set separately from the internal dashboard photo. The old smartsupp('chat:avatar') JavaScript API for overriding it has been removed and is no longer supported.
What's next?
Chat box languages — see the supported languages and how to change them.
Chat box status — control when your chat box appears online or offline.
Why can't I see the chat on my website? — fix a chat box that doesn't appear.
💡 Still need help? If you can't find a setting or something isn't working as expected, contact our support team via chat or email — we're happy to help.