> ## 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.

# Widgets overview

> Share an Onlyform form with a link, iframe, or interactive embed.js widget.

Onlyform provides two ways to place a published form on another website:

| Method     | Best for                                                    | JavaScript required |
| ---------- | ----------------------------------------------------------- | ------------------- |
| `iframe`   | Forms displayed directly inside page content                | No                  |
| `embed.js` | Full-page, popup, slider, popover, and side-tab experiences | Yes                 |

## Get the embed code

<Steps>
  <Step title="Publish the form">
    Widgets load the published form. Publish pending changes before testing the final embed.
  </Step>

  <Step title="Open Share">
    Open the form in the Onlyform dashboard and select **Share**.
  </Step>

  <Step title="Select an embed type">
    Choose Standard, Full page, Popup, Slider, Popover, or Side tab. Adjust the available design controls and check the desktop and mobile previews.
  </Step>

  <Step title="Copy and install the code">
    Select **Copy code**, paste the snippet into the target page, and replace placeholder hidden-field values before publishing.
  </Step>
</Steps>

<Frame caption="The Share page contains the public link, embed type selector, preview, design controls, and generated code.">
  <img src="https://mintcdn.com/onlyform/ax51_ngskpU7Lxw6/images/widgets/share-page.png?fit=max&auto=format&n=ax51_ngskpU7Lxw6&q=85&s=0ce1448ddef5be84ef564eaa198f03bc" alt="Illustration of the Onlyform Share page and embed controls" width="1912" height="945" data-path="images/widgets/share-page.png" />
</Frame>

## Choose an embed type

<CardGroup cols={2}>
  <Card title="Standard iframe" icon="window-maximize" href="/widgets/iframe">
    Keep the form within the normal page layout without loading widget JavaScript.
  </Card>

  <Card title="Full page" icon="expand" href="/widgets/embed-js#full-page">
    Let the form occupy the complete browser viewport.
  </Card>

  <Card title="Popup" icon="rectangle-history-circle-plus" href="/widgets/embed-js#popup">
    Open a centered modal from your own button.
  </Card>

  <Card title="Slider" icon="sidebar-flip" href="/widgets/embed-js#slider">
    Open the form in a panel from the left or right.
  </Card>

  <Card title="Popover" icon="message-dots" href="/widgets/embed-js#popover">
    Add a compact floating contact or feedback launcher.
  </Card>

  <Card title="Side tab" icon="table-columns" href="/widgets/embed-js#side-tab">
    Keep a persistent vertical launcher at the edge of the page.
  </Card>
</CardGroup>

## Public form URLs

Examples use `FORM_ID` for the form's public ID. The complete public URL can use any hostname configured for the form:

```text theme={null}
https://oy.fm/FORM_ID
https://YOUR_SUBDOMAIN.oy.fm/FORM_ID
https://forms.example.com/FORM_ID
```

Copy the URL shown on the Share page instead of constructing it yourself. See [Custom domains](/widgets/custom-domains) for the differences between iframe and JavaScript widgets.

<Note>
  Widgets do not use an API key. They display a public, published form and are separate from authenticated Public API requests.
</Note>
