Getting Started

The simplest installation is a single line — it runs in visitor mode, without authentication.

One-line embed

Add the tag below to your page's HTML and replace PROVIDER_ID with your own provider ID:

<script src="https://assets.webfon.io/sdk.js" data-provider-id="PROVIDER_ID" async></script>

That's all. When the page loads, the widget appears automatically in the bottom-right corner.

Where does the appearance come from?

Every setting — color, corner position, working hours, and which channels (chat / call) are enabled — comes from the admin panel; you do not have to put any of it in the embed code. See Admin Panel.

Next steps

This much is enough for most sites. Continue based on what you need:

• Using React / Vue / Svelte? → Follow the npm path on the Installation page.
• Want to identify your signed-in members? → Authentication.
• Want to open the panel from your own button? → Method Reference.

Opening from your own "Chat" button

If you would rather open the panel with a button on your site instead of the widget's own bubble:

CDN

<button onclick="window.Webfon.open()">Live Support</button>

npm

import { toggleApp } from '@webfon/client';

document.querySelector('#support').addEventListener('click', () => toggleApp(true));