Customizing the Chat Widget

Your chat widget should look like it belongs on your site, not like it was bolted on. This article walks through every appearance setting for the Bot Widget — the floating chat bubble — so you can match it to your brand in a few minutes.

All of these settings live in your HelpJet dashboard: open your bot, click Deploy in the sidebar (under Channels), and make sure you're on the Bot Widget tab.

How editing works

The Customization card is split into two columns: settings on the left, a Live Preview on the right. Every change updates the preview instantly, so you can experiment freely — nothing reaches your visitors until you save.

• Changes are staged, not live. An Unsaved changes indicator appears in the sticky header at the top of the page.
• Click Save Settings (top right) to publish your changes. You'll see All changes saved when everything is stored.
• If you try to leave the page with unsaved edits, your browser warns you first.

You never need to re-paste the embed code after changing appearance settings — the widget picks up saved changes automatically.

Settings reference

The sections below add detail where the table isn't enough.

Color and position

Widget Color is the single highest-impact setting — it colors the launcher bubble, the chat header, and the send button. Enter your brand's hex code directly in the text field, or click the swatch to open a color picker.

Widget Position moves the bubble between the bottom-left and bottom-right corner. Bottom-right is what most visitors expect; switch to Left if a cart button or scroll-to-top arrow already lives in the right corner.

Choosing a widget icon

The Widget Icon picker offers nine options: two speech-bubble styles, a stacked-conversations icon, a question mark, a robot, headphones, a life ring, a heart, and a circuit-style AI icon.

Match the icon to your bot's job: headphones or a life ring for support, a question mark for help centers, a robot when you want to signal an AI upfront, and speech bubbles as the neutral default.

Header settings

Header Text is your bot's public-facing name at the top of the chat window. It starts out as the bot name you chose at creation, but it doesn't have to stay that way — "Support" or "Ask us anything" often works better than an internal label.

Header Text Color defaults to white, which reads well against most saturated Widget Colors. If you pick a light widget color, switch the header text to a dark hex value so it stays legible.

Header Logo lets you show your own logo in the header (recommended size: 32×32px). This field is currently locked — it's a premium feature coming soon.

Center Header Content centers the logo and title in the header; turn it off for a left-aligned header.

Shape and size

Widget Rounded Corners and Button Rounded Corners each accept None, Small, Medium, Large, or Full. They're independent, so a fully-round launcher bubble with a softly-rounded chat panel is a common combination.

Max Width (px) caps how wide the open chat panel grows, between 300 and 800 pixels. The default of 400 suits most sites; go wider if your bot tends to give long, detailed answers, narrower if the widget competes with important page content.

Chat behavior

Welcome Message is the first thing visitors read when they open the widget — it sets expectations for what the bot can do. Every bot starts with "Hi! I'm [bot name]. How can I help you today?" (the new-bot wizard shows a generic "Hi there! How can I help you today?" placeholder before the bot exists). A good welcome message names the bot's scope: "Hi! I can answer questions about orders, shipping, and returns."

Collect Feedback adds a thumbs up / thumbs down prompt after the bot answers, so visitors can rate their experience. Leave it on — the ratings show up alongside conversations in your Activity tab and are the fastest way to find answers that need better training. See Reviewing Conversations.

Avoid covering page content keeps the chat bubble from sitting on top of your site's content. Turn it off only if you have a specific layout reason to.

The "Powered by HelpJet" footer

Every chat window shows a small Powered by HelpJet line beneath the message input. This branding is part of all standard plans.

Removing it (or replacing it with your own footer text) requires the Remove "Powered by HelpJet" add-on, available on the Pro plan. Once your organization has the add-on, the branding disappears across the widget, Page Embed, and Chat Link. See Add-ons, Credits & White-labeling for pricing and setup.

Controlling where the widget appears

Below the Customization card, the Bot Widget tab also holds display rules that show or hide the widget on specific pages of your site. That's a separate topic — see Widget Display Rules.

Common questions

Do I need to update my embed code after changing settings?

No. Click Save Settings and the widget on your site picks up the changes automatically — usually within a minute or two, depending on caching.

Why isn't my widget showing the new settings?

First check the sticky header on the Deploy page: if it says Unsaved changes, your edits haven't been published yet. If it says All changes saved, hard-refresh your site in a private/incognito window to rule out caching.

Can I style the widget differently on different sites?

Not per-site — one bot has one widget style. If you need different looks for different sites, create a separate bot for each (or use Duplicate Bot in General Settings to copy an existing setup).

The widget is enabled but not appearing on my site

Appearance settings aren't the culprit — check the Enabled toggle at the top of the Bot Widget tab, your bot's status in General Settings, and the troubleshooting steps in Deploying Your Bot.