# Embedding & popups

Embed your form on a website or show it as a popup over the page. Pick the options in the Public link sheet, then paste one snippet into your site.

Each snippet uses the share link selected in the sheet, with its expiry, response limit, custom domain and analytics. Query parameter values are not included. See [Share links](https://formstep.io/docs/sharing-publishing/sharing-embedding/).

## Inline embed

An inline embed shows the form inside your page.

1. Open the **Public link** sheet and click the **Embed** card.

2. Set the height and choose what to hide.

3. Click **Copy embed code** and paste it into your site’s HTML.

With **Auto-resize height** on, the embed grows with the form, so respondents never scroll inside it. Some site builders remove the small script this adds; then turn it off and set a height that fits. **Lazy load** waits to load the form until the visitor scrolls to it, which speeds up a page where the form sits further down.

## Popup

A popup shows the form on top of your page.

1. Open the **Public link** sheet and click the **Popup** card.

2. Choose how it opens, where it sits and how it looks.

3. Click **Copy popup code** and paste it into your site.

Under **Trigger**, pick how the popup opens. **Automatically on page load** opens it once the page has loaded, after an optional delay, and **Show once per session** stops it from opening again on every page of the same visit. **When a function is called** opens it from your own button or link: the comment in the copied code names the function to call, and the [site builder pages](#site-builders) show a button that calls it.

**Auto-close after submission** closes the popup three seconds after the respondent submits. It is off by default.

## Color scheme

Embeds and popups have the same color scheme setting, and it overrides the form’s own theme inside the frame. The default, **Let user specify**, follows the visitor’s light or dark preference. **Dark mode** and **Light mode** always use that mode.

> **Match your site's theme**
>
> If your website is always dark, pick Dark mode so the form blends in. To theme the form itself, see [Appearance & theming](https://formstep.io/docs/branding-domains/appearance-theming/).

## Step by step for your site builder

[Webflow](https://formstep.io/docs/sharing-publishing/embed-in-webflow/) — A Code Embed element

[WordPress](https://formstep.io/docs/sharing-publishing/embed-in-wordpress/) — A Custom HTML block

[Framer](https://formstep.io/docs/sharing-publishing/embed-in-framer/) — The Embed component

[Notion](https://formstep.io/docs/sharing-publishing/embed-in-notion/) — An Embed block, from the form's address

## Next steps

[Share links](https://formstep.io/docs/sharing-publishing/sharing-embedding/) — Create and manage share link URLs

[QR codes](https://formstep.io/docs/sharing-publishing/sharing-embedding/#qr-codes) — Generate and place scannable codes

[Your own domains](https://formstep.io/docs/branding-domains/custom-domains/) — Serve forms from your own domain

[Appearance & theming](https://formstep.io/docs/branding-domains/appearance-theming/) — Theme, cover, logo, dark mode