WebTalk 333
WebTalk Embed

Add WebTalk 333 to any website

Your integration has two independent choices: chat only or chat + AI, and one shared chat room or one chat room per page. That creates four combinations; if you are unsure, use the first example.

Who is WebTalk 333 for?

WebTalk 333 is a real-time conversation layer for people to discuss, watch, and build momentum together on the same website. It is not a conventional one-to-one customer-support chat window.

This version is not a customer-support tool: it has no support hotline, agent routing, ticketing system, or customer-service back-office interface. Position it as a many-to-many real-time conversation and shared-engagement tool, not a way for visitors to contact support.

Where should the code go?

In most cases, paste the complete <script>...</script> from an example below immediately before </body> on every page where chat should appear. It uses async, so it does not block page loading.

For “one chat room per page”, put <meta name="webtalk-page-id" ...> inside <head>, while the <script> still goes immediately before </body>.

If you are unsure, paste the first example immediately before </body>.

Choose your integration

webtalk-chat.js is chat only; webtalk.js is chat + AI. origin creates one shared chat room, while the default meta scope creates one chat room per page.

Chat + AI + one shared chat room (recommended)

Use this if you are unsure. It provides one site-wide chat room with AI summaries, page conversations, and @ai.

<script
  async
  src="https://webtalk-nine.vercel.app/webtalk.js"
  data-webtalk-scope="origin"
  data-webtalk-ai-endpoint="https://webtalk-nine.vercel.app/api/webtalk/ai"
></script>

Chat only + one shared chat room

One public chat room for the entire site, without AI requests.

<script
  async
  src="https://webtalk-nine.vercel.app/webtalk-chat.js"
  data-webtalk-scope="origin"
></script>

Chat only + one chat room per page

For articles, products, knowledge-base entries, and shared pages. Render a distinct page ID per page.

<meta name="webtalk-page-id" content="{{A stable, unique ID for this page}}" />
<script
  async
  src="https://webtalk-nine.vercel.app/webtalk-chat.js"
></script>

Chat + AI + one chat room per page

One chat room per content page with AI summaries, page conversations, and @ai.

<meta name="webtalk-page-id" content="{{A stable, unique ID for this page}}" />
<script
  async
  src="https://webtalk-nine.vercel.app/webtalk.js"
  data-webtalk-ai-endpoint="https://webtalk-nine.vercel.app/api/webtalk/ai"
></script>
AI prerequisite: Both chat + AI choices require a working data-webtalk-ai-endpoint. Chat-only choices make no AI requests.

Mobile layout

On desktop, the chat room sits at the right and can be resized. On mobile, it becomes a half-screen overlay; it does not change your DOM, CSS, or scrolling, and the other half still shows your website. 

<script
  src="https://webtalk-nine.vercel.app/webtalk-chat.js"
  data-webtalk-mobile-placement="bottom"
></script>

bottom (default) keeps the site on top and chat on the bottom. Set top to show chat on top and your site below.

All attributes

Attribute Values Purpose
data-webtalk-scope meta, origin, path Room strategy. meta is the default and safest option.
data-webtalk-page-id Stable page ID Overrides the webtalk-page-id meta tag; the meta tag is usually preferred.
data-webtalk-site-id Stable string Optional; the current site origin is used when omitted. Set the same stable value on multiple domains only when they should share a room.
data-webtalk-room-id Any stable string Specifies the room completely and has highest priority.
data-webtalk-meta-name Meta name Uses a custom meta tag name for the page ID.
data-webtalk-auto-mount true, false Mount immediately after loading, or wait until (for example) sign-in completes.
data-webtalk-virtual-room true, false Join cross-site presence; disabled by default.
data-webtalk-mobile-placement bottom, top Mobile half-screen overlay location; default bottom.
data-webtalk-ai-endpoint URL Required only for the hybrid bundle; points to a server-side AI proxy.
Advanced option: To create chat rooms from URL paths, use any example above and add data-webtalk-scope="path". For example, /share/a and /share/a/ use the same chat room.

Privacy and data flow

Chat messages: Chat content is transmitted between users' browsers over WebRTC DataChannel. Messages and local history are not written to the AI endpoint. The chat-only bundle makes no AI requests.
Connection establishment: WebRTC still needs the Artico signaling service to exchange SDP/ICE connection details. It is not a chat-message storage service. Do not describe the product as “all data never passes through any server.”
Hybrid AI: When a user requests a summary, uses page AI, or types @ai, page text and questions are sent to your configured AI endpoint, which calls an LLM provider. Disclose this in your privacy policy.

Coexisting with the Chrome extension

When a visitor has the WebTalk Chrome extension installed and your site mounts a WebTalk embed, the extension detects the official widget and stops its own UI and connection. Site owners do not need to add detection code or check for browser extensions.

Visitors without the extension can install WebTalk 333.

FAQ

No chat room appears?
The default meta scope requires webtalk-page-id. For one site-wide room, explicitly set data-webtalk-scope="origin".
Does the site use CSP?
Add the WebTalk domain to your script-src allowlist; the hybrid bundle also needs its AI endpoint in connect-src.
AI does not work?
Make sure you use the hybrid webtalk.js bundle and that data-webtalk-ai-endpoint is reachable from your site.
Do multiple domains need to share one chat room?
Most sites do not need data-webtalk-site-id; WebTalk automatically uses the current site origin. Only use the same stable site ID on each production domain when one brand needs them to share a room: 
<script
  async
  src="https://webtalk-nine.vercel.app/webtalk-chat.js"
  data-webtalk-site-id="my-brand-2026"
  data-webtalk-scope="origin"
></script>
For example, use my-brand-2026 on both brand.com and brand.tw. Keep it stable; do not generate a different random value each time.
Show chat only after sign-in?
This advanced integration remains supported: load the script without mounting it, call mount() after sign-in, and call unmount() at sign-out. 
<script src="https://webtalk-nine.vercel.app/webtalk-chat.js"
  data-webtalk-auto-mount="false"></script>
<script>
  // Run after your sign-in flow succeeds.
  window.WebTalk.mount({
    scope: 'origin',
    mobilePlacement: 'bottom'
  })

  // Run from your sign-out flow.
  window.WebTalk.unmount()
</script>
For chat + AI, load webtalk.js and pass aiEndpoint into mount(); an AI endpoint on the script tag is not carried into a manual mount.