One script tag. Works on every platform that lets you add custom HTML. Pick yours below.
Don't see yours? Let us know — if it supports custom HTML, TGLiveChat works there.
TGLiveChat is a single JavaScript file hosted on a CDN. You reference it with one script tag, pass your widget ID as a data attribute, and the widget boots itself. No npm install. No build step. No dependencies.
It works on any platform that lets you add custom HTML — which is essentially all of them. WordPress, Shopify, Webflow, Bubble, Squarespace, static sites, custom apps. If you can paste a script tag, you can use TGLiveChat.
The widget renders inside a Shadow DOM — a completely separate rendering context that's built into browsers. Your CSS can't reach inside it and the widget's CSS can't leak out to your page. They don't interfere.
This also means you don't need to worry about CSS specificity conflicts, z-index wars, or font inheritance messing up the widget appearance. It looks the same on every site it's installed on.
Pick the one that matches your setup. They all end up in the same place.
React / Next.js / Vite app
npm install @tglivechat/widget — official React component.
WordPress site (any theme)
Search TGLiveChat in WP admin — no code editing needed.
Plain HTML, static sites, or any framework. Paste one script tag before </body>.
Official WordPress plugin (search TGLiveChat in WP admin) or paste one script tag manually.
npm install @tglivechat/widget — official React component with StrictMode support and proper cleanup.
Edit theme.liquid. One paste, every page in your store gets the widget.
Project Settings > Custom Code. Paste once, shows on every published page.
Add via Script/Meta tags in Settings, or use an HTML element on your page.
Website > Pages > Code Injection. Works on all Squarespace plans with custom code.
Whatever platform you're on, the install is the same: paste this one line before your closing </body> tag.
Get your widget ID from the dashboard after signing up. Free to start.
The ones people ask most often.
Add one script tag before the closing </body> tag of your HTML. Replace YOUR_WIDGET_ID with the ID from your dashboard. That's the whole install. It works on any platform that allows custom HTML.
No. TGLiveChat uses Shadow DOM, which completely isolates the widget from your page. Your CSS can't affect the widget and the widget's CSS can't leak out to your page. They exist in separate rendering contexts and don't interfere with each other at all.
Yes. Run npm install @tglivechat/widget then render <TGLiveChat widgetId="YOUR_ID" /> in your app. For Next.js App Router, wrap it in a "use client" component. The package handles React StrictMode and cleanup automatically.
The easiest way is the official plugin — search TGLiveChat in Plugins → Add New, activate, and connect your account with one click. No code needed. Alternatively paste the script before </body> or use Insert Headers and Footers. The WordPress guide covers all methods.
Go to Online Store > Themes > Edit code and open theme.liquid. Paste the script tag before </body>. Save and you're done — the widget appears on every page in your store automatically.
Yes. Go to Project Settings > Custom Code and paste the script tag in the Footer Code section. Publish your site and the widget is live on every page. No extra plugins or Webflow integrations needed.
Almost certainly yes. If your platform lets you add custom HTML anywhere on the page, TGLiveChat will work — Wix, Framer, Ghost, and most website builders all support this. Follow the HTML guide and adapt the steps. If you're stuck, contact us and we'll check your specific platform.