Add the assistant to your website in 5 minutes

1. Get a publishable key

In the console, open Widget. Add the domains the widget may run on, for example www.example.com and localhost. Copy the publishable key. It starts with af_pk_.

A publishable key is safe in a web page. It can only open widget sessions, only on the domains you listed.

2. Paste the snippet

Put this before </body> on every page where the assistant should appear:

<script src="https://cdn.app.eshasan.com/airfone/widget/widget.js" data-key="af_pk_test_..." async></script>

Reload the page. A chat button appears in the bottom right corner. Messages go to the assistant you picked in the console, with the same knowledge and actions it has on WhatsApp.

3. Turn on voice

In Widget, switch on Talk. Visitors then see a Talk button that starts a voice call with the assistant in the browser. The browser asks for the microphone the first time. Voice code loads only when a visitor presses Talk, so pages stay light.

4. Link signed-in customers

If your visitors sign in, tell the widget who they are so the conversation lands on their AirFone contact. Compute the hash on your server with your identity secret (console, Widget):

// Node, on your server
import { createHmac } from 'node:crypto';
const userHash = createHmac('sha256', process.env.AIRFONE_IDENTITY_SECRET).update(user.id).digest('hex');

Then in the page:

<script>
  window.AirFone = window.AirFone || [];
  window.AirFone.push(['identify', [{ userId: 'u_123', userHash: '<from your server>', name: 'Sita Sharma', phone: '+9779800000001' }]]);
</script>

Calls queued this way run once the widget loads. After it loads you can call AirFone.identify({...}) directly.

Next

• Widget reference: every attribute, the JavaScript API, theming and events.