How to embed a form on your website

Markdown

View as Markdown

Share → Website gives you three layouts. Copy the snippet Formms generates: Standard, Popup, or Full page. Paste it as generated, and replace only the form URL if you are adapting an example.

1. Open Website

In the form, go to Share, then Website. The form must be published first. A draft has no public URL to embed.

Website embed with Popup highlighted

2. Pick a layout

  • Standard: inline on the page, grows with the questions
  • Popup: overlay from a button, the corner of the page, or similar
  • Full page: fills the window (height: 100vh)

Standard is the usual choice. Copy the snippet:

<div
  data-formms-embed="https://form.ms/be4we7?embed=1"
  data-title="Maple Street Block Party"
  data-height="700"
  data-dynamic-height="1"
></div>
<script src="https://api.form.ms/assets/embed.js" async></script>

Replace the form URL with yours. Leave the rest of the snippet as Formms generated it.

Website embed with Standard selected and the snippet

Use Customise and preview if you want to check the embed before you paste it.

Popup uses data-formms-popup instead of data-formms-embed. You can trigger it on click, from the bottom-right, with an overlay, a wave emoji, and hide-on-submit. The iframe loads only when the popup opens, so closed popups do not inflate view counts.

Full page can be a plain iframe to the form URL Formms shows in that panel. It does not need embed.js.

3. WordPress

Share → WordPress has an iframe snippet plus steps for the block editor (Custom HTML) and the classic editor (Text tab).

4. Tag Manager

Share → Tag Manager is two pieces:

  1. Put <div id="formms-form"></div> on the page
  2. A Custom HTML tag that injects an iframe with the form URL from that panel

Fire the tag on pages that include the placeholder, then submit the container.

Questions? Contact Formms or email [email protected].

Was this article helpful ?

Still need help?

Contact us