# Embed the phone in your software

The Widget SDK, for software vendors.

- Role: Manager
- Duration: 5 min
- On: Web
- Learning Centre: https://callizy.ca/en/apprendre/widget-sdk
- Integrations path · Lesson 8
- The page on callizy.ca: https://callizy.ca/en/produit/integrations

## What the integration does

The Widget SDK adds a Callizy phone to your web software: a bubble at the bottom of the screen that opens a keypad, the history and texts. Your users make and answer calls without leaving your software.

Each person signs in with their own Callizy account, in a Callizy window. Your software never sees their password, and the page holds no secret.

## Before you start

- A Callizy account with an active subscription, and a Callizy user for each person who will call.
- Access to the code of your website or web software.

## Step by step

6 steps, about 5 min.

Screenshots show Callizy in French. Button names are given in English.

**In the developer portal**

### 1. Create your developer account (2 min)

On callizy.ca/en/developers, click **Create an Account**: your email and a password, or Google. Confirm your email, then fill in **Complete your profile**.

### 2. Create an application (1 min)

In **Apps**, click **Create an app**. **Application name**: for example “My CRM”. **Allowed origins (CORS)**: your software’s address, for example https://myapp.com; separate several with a comma. Leave the **Redirect URI** as is, then **Create an app**.

### 3. Copy the key (10 s)

On the application’s card, click the **ID**: the client_id is copied. It is the widget’s integration key.

**In your software**

### 4. Add the script (1 min)

Paste these two tags at the end of the page, just before </body>, with your client_id. A bubble appears at the bottom right.

```
<script src="https://sdk.callizy.ca/v1/widget.js"></script><script>Callizy.init({ clientId: 'YOUR_CLIENT_ID', locale: 'en' });</script>
```

### 5. Connect a user (30 s)

The user clicks the bubble, then the button to connect Callizy. They sign in to Callizy in the window that opens and authorize your application. They can call right away.

### 6. Call from a client record (1 min)

On your call button, call Callizy.call with the number, then Callizy.open to open the panel. Always start it from a click: the browser only opens the microphone on a user gesture.

```
Callizy.call('+14165550123'); Callizy.open();
```

## Key points

- One application per software; its client_id is the only key in the page.
- Each user signs in with their own Callizy account.
- Without Callizy.open(), the call goes out, but the user only sees the bubble and has no button to hang up.

## Settings

- **Look**: In Callizy.init: position (bottom-right or bottom-left), locale (fr or en, fr by default), theme (dark or light), primaryColor for your brand color, offset to move the bubble away from the edge.
- **Your own button**: hideBubble: true hides the bubble; Callizy.open() opens the widget from your button.
- **Tabs**: defaultTab picks the starting tab and disabledTabs hides the others, among dial, history and sms.
- **Record already filled in**: Callizy.setContext({ phone, name }) fills in the keypad and shows the client’s name: the user only has to call.
- **How long the sign-in lasts**: persistence: session, the default, keeps the user signed in while the tab is open; local keeps them signed in after the browser closes; none signs them out on each reload.
- **Events**: Callizy.on listens to call.incoming, call.started, call.ended, sms.sent, sms.received, auth.connected and auth.disconnected. For example, on call.incoming, open the client’s record in your software.

## Not working?

### Callizy.call() does nothing

1. The user isn’t signed in yet: the widget shows the sign-in screen. Listen to auth.connected.
2. Start the call from a click, not when the page loads.

### The call goes out, but no one can hear

1. Started without a click, the call can go out with no microphone or sound: call from a button.

### The sign-in is refused

1. Your software’s address must be in **Allowed origins (CORS)**, with https://.
2. Is the application **PAUSED**? In its menu, click **Activate**.

### Callizy shows “The redirect URI is not valid. It must start with http:// or https://”

1. Put back the default value: https://api.callizy.ca/oauth/callback/.

## Frequently asked questions

### Do I need a server?

No: two tags in the page are enough. The widget needs no secret.

### Can the widget carry my brand?

The color, yes, with primaryColor. For a phone with no trace of Callizy, ask for the white-label widget: **Settings** › **Developers**, **White-label widget** tab, **Request access**.

### What happens if I delete the application?

Its key stops working: the widget can no longer sign anyone in.

Updated October 29, 2026.
