Installation

WordPress & WooCommerce

The easiest way is our free Techvea Support Bot plugin: download it from the plugin page, upload it under Plugins → Add New → Upload Plugin, and paste your Widget ID. On WooCommerce it adds live order-status and stock lookup.

Prefer not to use a plugin? Most themes have a "Header & Footer Scripts" option under Appearance → Theme Settings — paste the script tag into the footer field. A plugin like WPCode (Insert Headers and Footers) adds that option if your theme lacks it. Avoid text widgets; some page builders escape script tags.

Shopify

Go to Online Store → Themes → Edit code, open theme.liquid, and paste the script tag just before the closing </body> tag. This applies it to every page of your store.

Plain HTML

Paste it directly before the closing body tag of any page.

<!-- before </body> -->
<script
  src="https://techvea.com/widget.js"
  data-widget-id="YOUR_WIDGET_ID"
  async
></script>

Squarespace

Settings → Developer Tools (or Advanced) → Code Injection → Footer. Paste the script tag and save.

Code Injection is available on Squarespace's Business plan and above.

Webflow

Project Settings → Custom Code → Footer Code. Paste the script tag, save, and publish the site.

Custom code needs a paid Webflow site plan.

Framer

Site Settings → General → Custom Code → End of <body> tag. Paste the script tag and publish.

BigCommerce

Storefront → Script Manager → Create a Script. Set the location to Footer, pages to All pages, type to Script, and paste the tag.

Ghost

Settings → Code injection → Site Footer. Paste the script tag and save.

Google Tag Manager

Create a new tag of type Custom HTML, paste the script tag, set the trigger to All Pages, and publish the container. Handy when you can't edit the site's code directly.

Vue, Angular, Svelte, Vite

Add the script tag to index.html just before the closing body tag. The widget loads once and stays on screen as visitors move between pages.

Laravel, Django, Rails, PHP and other server-rendered sites

Add the script tag to your main layout or template, just before the closing body tag, so it appears on every page.

React / Next.js

Use Next's next/script component in your root layout with a lazy load strategy so it doesn't block your page from becoming interactive. In a plain React app without Next, add the same script tag to public/index.html.

// app/layout.tsx
import Script from "next/script";

export default function RootLayout({ children }) {
  return (
    <html lang="en">
      <body>
        {children}
        <Script
          src="https://techvea.com/widget.js"
          data-widget-id="YOUR_WIDGET_ID"
          strategy="lazyOnload"
        />
      </body>
    </html>
  );
}

When a site won't let you add a script

Some sites block outside scripts but allow embedded pages. Paste this where you want the chat to appear. Your dashboard's Channels tab has the same snippet with your ID filled in, plus a full-page chat link and QR code for places that have no website at all (Instagram bio, email signature, printed menu).

<iframe
  src="https://techvea.com/chat/YOUR_WIDGET_ID"
  title="Chat with us"
  style="width:100%;max-width:420px;height:600px;border:0"
  loading="lazy"
></iframe>