Embed → Popup

Popup embed

Trigger a form in a modal, right drawer, or bottom drawer. Click a button, follow a hash link, or call the JavaScript API.

1. Trigger types

Button click

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

Hash link

<a href="#maxforms-open=YOUR_FORM_CODE">Open form</a>

JavaScript API

Maxforms('openPopup', { formId: 'YOUR_FORM_CODE', layout: 'modal' });

See JavaScript API for full options.

2. Layouts

Three layouts via data-maxforms-layout:

modal (default) — centered overlay
drawer-right — slides in from the right
drawer-bottom — slides up from the bottom

3. Options

Attribute	Default	Effect
data-maxforms-layout	modal	Layout (modal, drawer-right, drawer-bottom).
data-maxforms-width	560	Modal width in px. Drawers ignore.
data-maxforms-overlay	1	Show backdrop (set to 0 to disable).
data-maxforms-autoclose	—	Auto-close N ms after submit.
data-maxforms-hide-on-submit	0	Hide the form after successful submission.

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.