Embed forms anywhere

Add a formssh form to your website with one line of code. Choose if the form sits inside the page, opens in a popup or slides in from the side.

How it appears

Three ways to show a form

In the page

The form sits inside your page and grows with its content, so nothing is cut off.

Popup

A button on your page opens the form on top of it, which works well for contact and waitlist forms.

Slide-in

A button stays in the corner of the screen and slides the form in from the side.

Copy the code

Replace your-form with the link name from your form's Share tab. Paste the code where the form or button should appear.

Options

data-form
The link name of your form from the Share tab, which is required.
data-mode
Set this to inline, popup or slider. Inline is the default.
data-text
These are the words on the button for the popup and slider modes.
data-color
Set the button colour, for example #0e1015.
data-floating
Set this to true to place the popup button in the corner of the screen.
data-position
Choose right or left for the corner button and the slide-in panel.

In the page

<script src="https://formssh.com/embed.js" data-form="your-form" async></script>

Popup

<script src="https://formssh.com/embed.js" data-form="your-form" data-mode="popup" data-text="Contact us" async></script>

Slide-in

<script src="https://formssh.com/embed.js" data-form="your-form" data-mode="slider" data-text="Get a quote" async></script>
WordPress

WordPress plugin

Install the formssh plugin to add forms without touching code. It adds a formssh block, a shortcode and a setting for a site-wide popup or slide-in button.

Download the WordPress plugin

Version 2.0.0 · WordPress 5.8 or newer

  1. 1Download the plugin ZIP below.
  2. 2In WordPress, go to Plugins, then Add New, then Upload Plugin, and choose the ZIP.
  3. 3Activate the plugin.
  4. 4In the editor, add the formssh form block and paste your form link. You can also open Settings, then formssh, to show a button on every page.

Shortcode

[formssh form="your-form"]

Shortcode with a popup button

[formssh form="your-form" mode="popup" text="Contact us"]

Guides for your website builder

Webflow

  1. 1Copy the embed code below.
  2. 2Add an Embed element where the form should go.
  3. 3Paste the code and save.
  4. 4Publish the site to see the form.

Wix

  1. 1Copy the embed code below.
  2. 2Add an Embed HTML element (Embed a Widget).
  3. 3Paste the code into the code field.
  4. 4Resize the element to fit your layout.

Squarespace

  1. 1Copy the embed code below.
  2. 2Add a Code Block where the form should sit.
  3. 3Paste the code and apply.
  4. 4Use a section with side padding for a clean edge.

Shopify

  1. 1Copy the embed code below.
  2. 2Open the page or product template in the theme editor.
  3. 3Add a Custom Liquid section and paste the code.
  4. 4The form fills the section width.

If your site builder blocks scripts

Some builders only accept an iframe. This code shows the form in the page. It keeps its height in step with the form where the builder allows a script, and stays at a fixed height where it does not.

iframe

<iframe id="formssh-embed" src="https://formssh.com/your-form?embed=1" width="100%" height="640" style="border:0;background:transparent" allowtransparency="true" title="formssh form"></iframe>
<script>window.addEventListener("message",function(e){try{var d=JSON.parse(e.data);if(d.type==="formssh:embed"){var f=document.getElementById("formssh-embed");if(f)f.style.height=d.height+"px"}}catch(x){}});</script>

Email apps remove embedded forms, so newsletters should link to your form.