# Iris.init

> Starts the widget on your page. Call it once, after the loader.

```ts
Iris.init(options: InitOptions): void
```

## Usage

Pass your App ID. Every other option is optional. Calls made before `iris.js` loads wait in a queue.

```js title="index.html"
Iris.init({ appId: "app_7Hq2xK9mPz" });
```

## Options

```js title="All options"
Iris.init({
  appId: "app_7Hq2xK9mPz",
  primary: "#D24100",
  mode: "auto",
  radius: "round",
  position: "right",
  launcher: true,
  horizontalPadding: 32,
  verticalPadding: 32,
});
```

Each option overrides the same setting in **Settings → Widget**. Leave an option out to keep the workspace value. The defaults are the values a new workspace starts with.

| Name | Type | Required | Default | Description | Example |
| --- | --- | --- | --- | --- | --- |
| `appId` | `string` | Yes |  | Your workspace's App ID. Copy it from **Settings → Install** in the dashboard. It is public, not a secret. Length: 1 to 64 characters. | `appId: "app_7Hq2xK9mPz"` |
| `primary` | `string` | No | `"#d24100"` | The colour of the launcher, the send button and links. Iris picks a readable text colour for it. Length: up to 100 characters. Format: any CSS colour: hex, `rgb()`, `hsl()`, `oklch()`. | `primary: "#D24100"` |
| `mode` | `string` | No | `"light"` | The colour scheme. `auto` follows the contact's system setting and changes with it. One of: `light` `dark` `auto`. | `mode: "auto"` |
| `radius` | `string` | No | `"default"` | The corner style of the panel, the messages and the buttons. One of: `sharp` `default` `round`. | `radius: "round"` |
| `position` | `string` | No | `"right"` | The bottom corner for the launcher and the panel. One of: `left` `right`. | `position: "left"` |
| `launcher` | `boolean` | No | `true` | Shows the launcher. Pass `false` to hide it and open the widget from your own button with [`data-iris-open`](/guides/open-from-a-link/) or `Iris.open()`. To change it later, call [`Iris.update`](/reference/update/). | `launcher: false` |
| `horizontalPadding` | `integer` | No | `20` | The launcher offset from the left or right edge of the page. The open panel moves with the launcher. Phones ignore it. Range: 20 to 200 px. | `horizontalPadding: 32` |
| `verticalPadding` | `integer` | No | `20` | The launcher offset from the bottom edge of the page. The open panel moves with the launcher. Phones ignore it. Range: 20 to 200 px. | `verticalPadding: 32` |

## Init or update

To change `launcher` after the widget starts, call [`Iris.update`](/reference/update/). To change another option, reload the page with new `Iris.init` options.

## On phones

On screens narrower than 480 px, the widget opens full screen. The launcher offset has no effect there.

## Console warnings

| Message | What happened | Fix |
| --- | --- | --- |
| `Iris: the widget did not start, because the App ID is missing or not valid.` | `Iris.init` got no `appId`, an empty one or one longer than 64 characters. | Pass your App ID as `appId`. Copy it from **Settings → Install**. |
| `Iris: ignored <option>: <value>, because it is not a valid value.` | An `Iris.init` option or a widget setting is outside its limits, such as `verticalPadding: 300`. Iris used the workspace value. | Use a value within the limits of the [`Iris.init` options](/reference/init/#options). |