# Popup embed

> Open a Maxforms form in a modal or a pinned bottom-right panel.

Trigger a form in a centered modal or a panel pinned to the bottom-right corner. Click a button, follow a hash link, or call the JavaScript API.

## 1. Trigger types

### Button click

```html
<button data-maxforms-popup="YOUR_FORM_CODE">Open form</button>
```

### Hash link

```html
<a href="#maxforms-open=YOUR_FORM_CODE" data-maxforms-popup="YOUR_FORM_CODE">Open form</a>
```

The hash is read **once, when the page loads**. There is no `hashchange` listener, so a link that only changes the hash on the current page won't open anything on its own — keep `data-maxforms-popup` on the anchor (as above) so the click trigger fires too. Use the bare hash form for links arriving from *another* page.

### JavaScript API

```js
Maxforms('openPopup', { formId: 'YOUR_FORM_CODE', position: 'center' });
```

See [JavaScript API](/developers/embed/javascript-api) for full options.

## 2. Positions

Two positions via `data-maxforms-position`:

- `center` (default) — centered modal over a backdrop
- `bottom-right` — panel pinned to the bottom-right corner of the viewport

## 3. Options

| Attribute | Default | Effect |
| --- | --- | --- |
| `data-maxforms-position` | `center` | `center` or `bottom-right`. |
| `data-maxforms-width` | `560` | Popup width in px. |
| `data-maxforms-overlay` | `1` | Show backdrop (set to `0` to disable). |
| `data-maxforms-hide-on-submit` | `0` | Hide the form after successful submission. |
| `data-maxforms-hide-delay` | — | Milliseconds to wait before hiding. **Only applies when `data-maxforms-hide-on-submit="1"`.** |
| `data-maxforms-show-title` | `0` | Show the form's title (hidden by default). |
| `data-maxforms-align-left` | `0` | Left-align the form. |
| `data-maxforms-transparent-background` | `0` | Transparent form background. |
| `data-maxforms-track` | `1` | Emit lifecycle events (set to `0` to disable). |
| `data-maxforms-field-*` | — | Pre-fill a declared hidden field, e.g. `data-maxforms-field-ref="launch"`. |

### Opening without a click

Put these on any element carrying `data-maxforms-popup`:

| Attribute | Effect |
| --- | --- |
| `data-maxforms-open="auto"` | Open automatically after `data-maxforms-delay` ms (default `5000`). |
| `data-maxforms-open="exit-intent"` | Open the first time the pointer leaves the document. |

## 4. Accessibility

Popups ship with `role="dialog"`, `aria-modal="true"`, focus trap (Tab cycles inside the popup), ESC-to-close, and backdrop-click-to-close. Focus returns to the trigger element when the popup closes.