Widget Installation

Getting Your Embed Code

Navigate to Dashboard -> Assistants -> Your Bot -> Embed Code. You will see a snippet similar to:

<script src="https://cdn.conviro.io/widget/widget.iife.js"></script>
<script>
  cw('init', { publicKey: 'pk_YOUR_PUBLIC_KEY' });
</script>

Below are step-by-step instructions for every major platform.

WordPress

1. Go to your WordPress admin panel.
2. Navigate to Appearance -> Theme File Editor -> footer.php (or use a plugin like Insert Headers and Footers).
3. Paste the embed code just before the \</body\> tag.
4. Click Update File.
5. Clear any caching plugin (WP Super Cache, W3 Total Cache, etc.) and verify.

Shopify

On Shopify you do not paste the embed code into your theme. Use the Conviro app from the Shopify App Store instead -- the widget is its Conviro AI Chat app embed:

1. Install Conviro from the Shopify App Store and link your Conviro workspace (see the Shopify Integration article).
2. In the app, click Turn on in theme editor. The theme editor opens with the Conviro AI Chat app embed switched on.
3. Click Save.

No theme code is edited.

Wix

1. Go to Settings -> Custom Code in your Wix dashboard.
2. Click + Add Custom Code.
3. Paste the embed code, set placement to Body - End.
4. Apply to All pages and click Apply.

Squarespace

1. Go to Settings -> Advanced -> Code Injection.
2. Paste the embed code in the Footer field.
3. Click Save.

Custom HTML / Static Sites

Simply paste the embed code before the closing \</body\> tag in your HTML file. The widget script loads asynchronously and will not block page rendering.

React / Next.js

For React or Next.js projects, you can load the widget in your root layout or \<App\> component:

// app/layout.tsx (Next.js App Router example)
import Script from 'next/script';

export default function RootLayout({ children }) {
  return (
    <html>
      <body>
        {children}
        <Script
          src="https://cdn.conviro.io/widget/widget.iife.js"
          strategy="afterInteractive"
        />
        <Script id="conviro-init" strategy="afterInteractive">
          {`cw('init', { publicKey: 'pk_YOUR_PUBLIC_KEY' });`}
        </Script>
      </body>
    </html>
  );
}

Verifying the Installation

1. Open your website in a browser.
2. You should see the Conviro chat bubble in the bottom-right (or bottom-left, depending on your settings).
3. If it does not appear, check the Widget Not Showing troubleshooting article.