Website Chat Quick Start

Website Chat is Resool's live chat widget: a chat button on your website that opens a chatbox where visitors can message your team in real time. Every visitor conversation lands in the same Resool inbox as WhatsApp, Messenger, Instagram and email, so your team can reply, assign and automate it, and hand it to an AI Agent. You create the widget in one click, paste one line of code into your site, and customize its look, behavior and security whenever you like.

#What visitors can do in the chatbox

• Send messages, emoji, files and voice messages.
• Leave their email or phone so your team can follow up.
• Search your help articles with AI before writing to you, if you turn on Search AI.
• Rate the conversation after it's closed, if you turn on satisfaction surveys.
• See your away message outside business hours.
• Come back later and continue the same conversation in the same browser.

#Before you begin

• Only Owners and Admins (or a custom role with Connect and configure channels) can create a website chat.
• You need access to your website's code, theme or tag manager to add the script.
• Each website chat counts as one channel toward your plan's limit.

#How to create a website chat

1. Go to Settings › Channels and click Add Channel.
2. Open the Live Chat tab, find Website Chat and click Connect.

Screenshot placeholder

Settings › Channels › Add Channel, Live Chat tab

The Website Chat card and the Custom Channel (Live Chat) card with their Connect buttons.

File: screenshots/website-chat-quick-start-catalog.png

1. Resool creates the channel, named Live chat, and opens its page. Rename it on the Configuration tab if you like, for example after your website.

#How to add the chat widget to your website

1. On the channel's page, open the Install on your site tab.
2. Click Copy code to copy the script.
3. Paste it before the closing </body> tag on every page of your website. On most website builders, add it in the site's custom code, footer code or tag manager.

Screenshot placeholder

Settings › Channels › the Live chat channel › Install on your site

The Install on your site tab with the instruction "Add this code before '</body>' on every page of your website.", the dark code box with the script and the Copy code button, and the Live preview section below with the preview link, Copy preview link and Open live preview.

File: screenshots/website-chat-quick-start-install.png

The code looks like this, with your own key:

<script src="https://…/widget.js" data-key="wk_…" data-api="https://…" async></script>

You can add two optional attributes to the script tag:

• data-lang="ar" or data-lang="en" forces the chatbox language on that page.
• data-open="true" opens the chatbox when the page loads.

1. Open your website. The chat button appears in the bottom corner.

#How to test the chat widget

You can test before you install anything:

1. On the Install on your site tab, under Live preview, click Open live preview (also in the channel page's header).
2. Send a message in the chatbox.
3. Go to the Inbox. The conversation appears as a Live chat conversation. Reply and watch it arrive in the preview.

Share the preview link with teammates to show them the widget with your current settings.

Screenshot placeholder

The live preview page opened from Open live preview

The chatbox open on the preview page with the header "Questions? Chat with us!", the welcome message, a visitor message "Hello" and the composer "Compose your message…".

File: screenshots/website-chat-quick-start-preview.png

#How to set your away message and business hours

1. Open the channel and go to the Appearance tab.
2. Under General, fill in Away message (English) and Away message (Arabic).
3. Under Business hours, choose Always online, or Set hours and pick a Time zone, the days you're open and the opening and closing times.
4. Click Save on the save bar.

Outside your hours, visitors see your away message and can still leave a message.

#How to configure your website chat

Your website chat has these tabs:

• Configuration: the channel name and Delete channel.
• Appearance: colors, header text, welcome message, languages, the chat button, away messages and business hours. See Website chat appearance and behavior.
• Behavior: what visitors see first, asking for email or phone, files, privacy and more.
• Search AI: AI search from your knowledge sources inside the chatbox.
• Security: allowed websites, privacy and anti-bot protection. See Website chat security and restrictions.
• Restrictions: hide the chatbox on pages, in countries or for IPs.
• Install on your site: the code and the live preview link.

#Notes and limitations

• Website chat has no messaging window: you can reply at any time while the visitor's conversation is open in their browser.
• Visitors are recognized by their browser. If they use another device or clear their browser data, they start a new conversation unless they leave an email or phone.
• If you restrict the widget to certain websites, it won't load anywhere else, including your staging site. See Website chat security and restrictions.

#FAQ and troubleshooting

#The chat button doesn't appear on my website. What can I do?

What you can do:

• Check that the script is on the page, before </body>, and that the page was republished.
• Check Security › Allowed websites. If it lists domains, your site's domain must be one of them.
• Check Restrictions: vacation mode, page rules, blocked countries, locales or IPs can hide the chatbox.
• Check Behavior: the chatbox can be hidden on mobile or when all operators are away.

#Can I add the widget to more than one website?

Yes. Use the same code on several sites, or create a separate website chat for each site so you can style and route them differently.

#Does the widget slow down my website?

The script loads asynchronously (async), so it doesn't block your page from loading.

#Can visitors chat in Arabic?

Yes. The chatbox supports English and Arabic, including right-to-left layout. Choose the languages on the Appearance tab.

#What's next?

• Website chat appearance and behavior
• Website chat security and restrictions
• Channel settings
• Knowledge base