Book a meeting

How to customize the live chat widget and window?

Estimated reading: 5 minutes 232 views

Customising the Zoho SalesIQ live chat widget and window helps it match your website’s look and feel, making chat feel like a natural part of your brand rather than a bolt-on tool.

Set up the chat window home page

Start by choosing how visitors can reach you.

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Homepage > Visitor engagement modes.
  2. Enable Chat, Call, or both. With Chat, visitors start a chat session from your website, with the option to add a call once the chat is underway. With Call, visitors connect by voice directly from your site.

Add a chat window message

Set a welcome message or brand line that introduces your business before visitors connect with an operator.

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Homepage > Chat window message.
  2. Set separate messages for when operators are online (online content) and when none are available (offline content).

Display your company logo on the home page

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Homepage > Display company logo.
  2. Toggle the option on. The logo shown is the one uploaded in your company profile.

Customise the colour of your widget and chat window

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Customize.
  2. Pick a colour and preview it on your website. Choose a colour that either matches your site’s palette or contrasts enough to be easy to spot.

Display your company logo in the chat window

As with the home page, you can also show your logo inside the chat window itself, using the same logo uploaded in your company profile.

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Customize.
  2. Enable Display company logo.

Customise the appearance of your chat widget

The floating chat widget stays visible as visitors scroll, so its look matters.

  • To hide the widget’s message and show only the chat icon, go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Chat widget > Hide widget message.
  • Replace the default chat icon with a custom sticker under Custom sticker in the same path, using an image that clearly shows help is available.
  • Set separate messages for when operators are online or offline under Widget message – Online and Widget message – Offline.
  • Enable Include operator image to show the operator’s picture on the widget icon.
  • Hide the widget on mobile browsers, or when operators are offline or outside business hours, if you prefer a less visible presence.
  • Choose whether the widget sits in the bottom-left or bottom-right corner of your site.

Customise the appearance of the chat window

  • Seasonal themes: apply a seasonal or festival design for set dates, under Chat window > Seasonal Theme.
  • Theme: choose an overall theme for your chat window under Choose a theme for your chat window.
  • Size: choose Medium or Large for desktop; mobile chat windows adjust automatically to screen size.
  • Operator profile picture: show the operator’s photo when they connect with a visitor, adding a personal touch.
  • Mute notifications: let visitors mute chat notification sounds if they find them distracting.

Use custom CSS for advanced styling

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Chat window > Upload custom CSS.
  2. Choose whether you’re using the old or new chat window design, then upload your CSS accordingly.
  3. Use the live preview to check your changes before saving.

Personalise the self-service knowledge base

Adding a knowledge base to the chat window helps visitors find answers without waiting for an operator.

  • Articles: under Knowledgebase > Articles, customise the tab name, translate it, set a default language fallback, show article author information, enable visitor feedback, and group articles by department or category.
  • FAQs: under Knowledgebase > FAQs, customise the FAQ tab similarly, including translation, default language, author info, feedback and categorisation.

Change the chat window language and font

By default, the chat window follows your website’s language and font, but you can override this.

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Language/Font.
  2. Select a language from the dropdown and save, or choose Website Language to keep it in sync with your site.

SalesIQ supports a wide range of languages, including right-to-left languages such as Arabic and Hebrew.

Arabic and Hebrew (right-to-left)

  1. Go to Settings > Brands > Choose a brand > Personalization > Chat & Call > Language/Font.
  2. Under Choose a language for your chat window, select Arabic or Hebrew.
  3. Click Save.

Selecting either language automatically switches the chat window layout to right-to-left.

Frequently asked questions

Can I change the chat window language independently of my website?

Yes, under Language/Font you can set a specific chat window language, or choose Website Language to keep it in sync with your site.

Does SalesIQ support right-to-left languages?

Yes, choosing Arabic or Hebrew automatically switches the chat window layout to right-to-left.

Can I use my own CSS to style the chat window?

Yes, advanced users can upload custom CSS for full control over the chat window’s appearance, with a live preview before saving.

Need help?

Need help customising your SalesIQ chat widget? Contact support@thoughtlogik.com or see our Zoho implementation services.

How to customize the live chat widget and window? - PreviousHow to configure chat window options?Next - How to customize the live chat widget and window?For Administrators

Recently Viewed articles

Leave a Reply

Your email address will not be published. Required fields are marked *

Learn how we helped 100 top brands gain success

Subscribe

×
Cancel