Install the chat on your website

The chat installs by pasting a short code into your site, once.

Using an AI assistant in your code editor? In App settings > Developers > Getting started, pick “With your AI assistant” and copy the Setup prompt, also in Documentation > Quick start. It installs the chat for you, then tells you what it did.

1. Open App settings > Developers > Getting started. In the install step, pick “HTML” in “Tool”.
2. Copy the install code shown and paste it before the </body> tag on every page of your site.
3. Open your site on your computer: the chat button shows at the bottom of the page.
4. Before going live, set your site’s domain, for example kibomarket.com, in App settings > Developers > Domain, apps and pages. The site moves to Production as soon as the chat shows on that domain: see Development and Production Modes.

<script>  window.zean = { appKey: "app_your_app_key" };</script><script async src="https://your-loader-address/loader.js"></script>

This code is an example: app_your_app_key and the script address stand for the real values. The real code, with your App’s key and the right address, is in App settings > Developers > Getting started: copy it from there. It never changes: chat updates and your appearance changes arrive without touching it.

Is your site built with Next.js, React Router, TanStack Start, React, Nuxt or Vue? Install the web SDK instead: see Install the chat on a React site and Install the chat on a Vue site. On WordPress or Shopify, see Install the chat on WordPress or Shopify.

In the chat, the Screenshot button lets the Contact send you a picture of the page, with an arrow or a box on what is wrong. Their browser first asks them to share the tab. If your site forbids screen capture, the chat redraws the page instead: videos, maps and images from other sites may be missing from it. The button shows on computers only: phone browsers cannot capture the page.

While the Contact has replies to read, your site’s tab shows their number in its title and a red dot on its icon. Your developers can turn it off: see Show the unread count.

For your developers

Opening the chat from a button on your page, showing the unread count, picking the chat’s language or identifying the Contact: it is all in Documentation > Website.

The chat does not show? Check the Domain first, then read the article The chat does not show.