> ## Documentation Index
> Fetch the complete documentation index at: https://docs.onlyform.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Widget options

> Reference for iframe settings and the embed.js configuration object.

## embed.js configuration

Set these properties on `window.onlyform` before loading `https://oy.fm/embed.js`.

| Property          | Type      | Applies to        | Description                                                  |
| ----------------- | --------- | ----------------- | ------------------------------------------------------------ |
| `id`              | string    | All               | Required public form ID. Use the ID shown by the Share page. |
| `type`            | string    | All               | `fullPage`, `popup`, `slider`, `popover`, or `sideTab`.      |
| `hideHeaders`     | boolean   | All               | Hides compatible form headers when `true`.                   |
| `popupSize`       | string    | Popup             | `small`, `medium`, or `large`. Defaults to `medium`.         |
| `position`        | string    | Slider            | `left` or `right`. Defaults to `right`.                      |
| `buttonColor`     | CSS color | Popover, side tab | Background color for the built-in launcher.                  |
| `buttonText`      | string    | Side tab          | Text displayed by the built-in launcher.                     |
| `greetingMessage` | string    | Popover           | Optional text displayed beside the launcher.                 |
| `notificationDot` | boolean   | Popover           | Displays an attention dot when `true`.                       |

Popup and slider button text, color, font size, and corner radius belong to the trigger button's HTML/CSS rather than the configuration object.

## Trigger button contract

Popup and slider widgets search for this button after mounting:

```html theme={null}
<button
  type="button"
  data-button="onlyform"
  data-embed-id="FORM_ID"
>
  Open form
</button>
```

The `data-embed-id` value must exactly match `window.onlyform.id`.

## Share designer controls

The dashboard Share page provides a live desktop/mobile preview and exposes controls appropriate to the selected embed:

| Embed     | Available design controls                                                                           |
| --------- | --------------------------------------------------------------------------------------------------- |
| Standard  | Width, fixed or automatic height, full-screen mobile preview, background transparency, hide headers |
| Full page | Hide headers                                                                                        |
| Popup     | Size, button text, button color, font size, rounded corners, hide headers                           |
| Slider    | Left/right position, button text, button color, font size, rounded corners, hide headers            |
| Popover   | Button color, greeting message, notification dot, launcher icon preview, hide headers               |
| Side tab  | Button text, button color, launcher icon preview, hide headers                                      |

<Note>
  Copy the generated snippet after changing design controls. The preview state itself is not saved into an embed already installed on your website.
</Note>

## Launcher icons

The Share designer currently offers these launcher icon names:

```text theme={null}
message-2, message-chatbot, message-circle, message-dots,
message-report, message, messages, mail-fast, text-caption,
bubble-text, clipboard-text, file-text
```

Launcher icon rendering is controlled by the current widget bundle. Use the Share preview and copied snippet as the source of truth for the selected icon.