Web Chat Widget

Connecting Channels

Embed a customizable chat widget on your website so visitors can message your team directly.

Create a Web Chat channel

Creating a channel runs through a short wizard (Details → Type → Customize → Finish):

Go to Settings → Channel and click Create Channel
Details — Enter a name for your channel (e.g., "Website Chat")
Type — Select Web
Customize — Set the initial appearance:
- Primary Color — Accent color of the widget
- Widget Title — Heading shown in the chat window (e.g., "Chat with us")
- Widget Subtitle — Secondary text below the title
- Require pre-chat form — Visitors fill in their details before starting a conversation
Finish to create the channel

After creating the channel, open Settings → Channel → [Your Channel] → Details → Design to fine-tune the appearance:

Setting	Description
Position	`bottom-right` or `bottom-left` of the screen
Primary Color	Accent color of the widget
Widget Title	Heading shown in the chat window
Widget Subtitle	Secondary text below the title
Popup Message	Optional greeting shown before the visitor opens the chat
Popup Delay	How long to wait (in seconds) before showing the popup message

Embed on your website

Open the Configuration tab and copy the generated embed snippet. Qwetty generates a single HTML <script> tag — paste it before the closing </body> tag of your site:

Code
<script
  src="https://app.qwetty.com/webchat/embed.js"
  data-organization-id="YOUR_ORGANIZATION_ID"
  data-channel-id="YOUR_CHANNEL_ID"
  data-position="bottom-right"
  data-primary-color="#10b981"
  data-widget-title="Chat with us"
  data-widget-subtitle="We typically reply within minutes">
</script>

The values are pre-filled with your channel's configuration in the Configuration tab — copy the snippet from there rather than building it by hand. For the full list of supported data-* attributes, see the Web Chat Widget SDK.

How it works

Visitors start a guest chat session — no login required
Messages appear in your Qwetty inbox alongside WhatsApp and Instagram conversations
The widget uses WebSocket for real-time messaging
If the "require form" option is enabled, visitors provide their name and contact info before chatting

Next steps

Channel Configuration — Advanced widget settings
Inbox Overview — Managing web chat conversations
Web Chat Widget SDK — Developer integration guide

Last modified on June 10, 2026

Connect Instagram Channel Dashboard

Create a Web Chat channel

Creating a channel runs through a short wizard (Details → Type → Customize → Finish):

Go to Settings → Channel and click Create Channel

Details — Enter a name for your channel (e.g., "Website Chat")

Type — Select Web

Customize — Set the initial appearance:

Primary Color — Accent color of the widget
Widget Title — Heading shown in the chat window (e.g., "Chat with us")
Widget Subtitle — Secondary text below the title
Require pre-chat form — Visitors fill in their details before starting a conversation

Finish to create the channel

Customize the widget

After creating the channel, open Settings → Channel → [Your Channel] → Details → Design to fine-tune the appearance:

Setting

Description

Position

bottom-right or bottom-left of the screen

Primary Color

Accent color of the widget

Widget Title

Heading shown in the chat window

Widget Subtitle

Secondary text below the title

Popup Message

Optional greeting shown before the visitor opens the chat

Popup Delay

How long to wait (in seconds) before showing the popup message

Embed on your website

Open the Configuration tab and copy the generated embed snippet. Qwetty generates a single HTML <script> tag — paste it before the closing </body> tag of your site:

Code

<script
  src="https://app.qwetty.com/webchat/embed.js"
  data-organization-id="YOUR_ORGANIZATION_ID"
  data-channel-id="YOUR_CHANNEL_ID"
  data-position="bottom-right"
  data-primary-color="#10b981"
  data-widget-title="Chat with us"
  data-widget-subtitle="We typically reply within minutes">
</script>