Quickstart

Get the Inviaro chat widget on your website in under five minutes.

1. Get your widget key

In the Inviaro admin, create a Widget channel connection. Copy the widget key (a 48-character random string).

wt_qK9pL2xR8vxxxxxxxxxxxxxxxxxxxxxxxxx

The key is public. Embed it directly in your page HTML.

2. Add the script tag

Drop one tag into your page, ideally just before </body>:

<script>
  window.InviaroSettings = {
    key: 'wt_qK9pL2xR8vxxxxxxxxxxxxxxxxxxxxxxxxx',
    origin: 'https://yourdomain.com'
  };
</script>
<script src="https://widget.inviaro.com/v1.js" async></script>

A floating chat launcher appears in the bottom-right corner. Click it to open the panel.

3. Verify it works

Open your page in a browser. You should see:

• A floating button bottom-right.
• Clicking it opens the chat panel.
• Typing a message sends it to your Inviaro inbox.
• The reply appears in real time.

If nothing appears, open DevTools and check the console for an error prefixed with [Inviaro]. The most common cause is an origin mismatch.

4. Common adjustments

Custom position

<script>
  window.InviaroSettings = {
    key: 'wt_...',
    origin: 'https://yourdomain.com',
    position: 'bottom-left'
  };
</script>

Force dark theme

<script>
  window.InviaroSettings = {
    key: 'wt_...',
    origin: 'https://yourdomain.com',
    themeMode: 'dark'
  };
</script>

Workspace logo

<script>
  window.InviaroSettings = {
    key: 'wt_...',
    origin: 'https://yourdomain.com',
    brand: {
      name: 'Acme',
      logoUrl: 'https://yourdomain.com/logo.svg'
    }
  };
</script>

Pre-chat form

<script>
  window.InviaroSettings = {
    key: 'wt_...',
    origin: 'https://yourdomain.com',
    brand: {
      preChat: {
        requireName: true,
        requireEmail: true
      }
    }
  };
</script>

What's next

• Configuration for every setting in one place.
• Identity verification to bind chats to logged-in users.
• Mobile apps to embed in Capacitor or React Native.
• Privacy and consent for GDPR compliance.