Skip to content
Getting started

Web widget installation

Add the Liya live chat and AI widget to your website or web app in a few minutes.

3 min read Updated October 2026
The web widget lets customers start a conversation directly from your website or app. All widget conversations route into your Liya inbox alongside email and other channels.

Add the script tag

Paste the following snippet before the closing </body> tag on every page where you want the widget to appear. Replace YOUR_EMBED_TOKEN with the token for your workspace.

html
<script
  src="https://liyaengine.ai/widget.js"
  data-token="YOUR_EMBED_TOKEN"
  data-api="https://api.liyasupport.com"
  async
></script>
The easiest way is to copy the finished snippet from Control Center → Chat Widget → Embed code. It already contains your token, which starts with liya_pub_. Save your widget settings first so the token is created.

Customising the widget

Most of the widget's look and behaviour (logo, welcome screen, quick replies, launcher style) is set in Control Center → Chat Widget and applies without changing your site. A few options can also be set directly on the script tag, and the tag always wins over the dashboard:

html
<script
  src="https://liyaengine.ai/widget.js"
  data-token="YOUR_EMBED_TOKEN"
  data-api="https://api.liyasupport.com"
  data-title="Ask MPI"
  data-greeting="Hi, how can we help?"
  data-color="#1F4E79"
  data-position="bottom-right"
  data-mode="bubble"
  async
></script>
AttributeDefaultDescription
data-tokenrequiredYour workspace embed token
data-apirequiredThe Liya API address, https://api.liyasupport.com
data-titleAsk us anythingTitle in the chat header
data-greetingHi! How can I help you today?The first message shown to visitors
data-color#0ea5e9Accent colour for the launcher and header
data-positionbottom-rightLauncher position: bottom-right or bottom-left
data-modebubblebubble for a floating chat window, side-panel for a panel docked to the page edge

Testing the installation

1

Load your website

Open the page where you added the snippet. You should see the chat launcher in the corner you chose.

2

Send a test message

Click the launcher and type a test message. It should appear in your Liya inbox as a new conversation within a few seconds.

3

Verify AI draft

Open the conversation in your dashboard. If you have knowledge base content set up, you should see an AI draft ready for review.

Troubleshooting

Widget not appearing

  • Check the browser console for JavaScript errors. The widget logs a warning if the token or API address is missing.
  • Confirm data-token is the full token with no extra spaces or quotes, and that data-api is https://api.liyasupport.com.
  • Confirm the script address is https://liyaengine.ai/widget.js. Snippets that point at widget.liyasupport.com or cdn.liyasupport.com are out of date and will not load.
  • If you have a Content Security Policy, allow the script and API addresses shown below.

Conversations not appearing in inbox

  • Ensure your workspace is on an active plan.
  • Check the embed token is still active in Control Center → Chat Widget.
  • Try a hard refresh (Cmd/Ctrl + Shift + R) in the dashboard.

Content Security Policy

Add the following directives to your CSP header to allow the widget to load and communicate:

text
script-src 'self' liyaengine.ai;
connect-src 'self' api.liyasupport.com;
img-src 'self' data: api.liyasupport.com;