Embed Your Form on a Website

Prev Next

You can place a FastField form on your own website, so visitors fill it out without leaving the page. This article covers how to allow a website, size the form, and copy the embed code.

How embedding works

An embedded form is a web form shown inside a frame on your web page. People don't need a FastField login, and their submissions come back to FastField.

Before you embed a form:

  • Turn on public submissions for the form. Learn how to publish web forms and generate QR codes

  • Add each website that shows the form to the Allowed Websites list. The form doesn't load on a website that isn't on the list

Note

Embedding is part of the External Forms add-on. An account admin turns it on from the billing page in the portal. Learn more about add-on features.

Allow your website

  1. In the Form Builder, select Settings in the toolbar at the bottom of the canvas.

  2. Select Enable Webforms.

The Form Settings menu with Enable Webforms selected

  1. Make sure Allow public submissions is on.

  2. Under Embedding Settings, enter your website's domain in Allowed Websites, for example example.com.

  3. Select Add. Repeat for each website.

Allowed Websites with example.com added to the list

To remove a website, select the remove icon next to it.

Copy the embed code

  1. Under Embed Code, enter the Width and Height of the form in pixels. The defaults are 600 and 800.

  2. Select Copy Embed Code.

The Width and Height boxes, the embed code, and the Copy Embed Code button

  1. Select Save Draft or Publish to save the website list and size.

  2. Paste the code into your web page's HTML where you want the form to appear.

The code also lets the form use the visitor's camera, microphone, and location. That way photo, audio, and GPS fields work on your page.

Note

If the form hasn't been saved yet, the embed code doesn't exist. Select Save Draft first.

Copy the code after you publish

The first time you publish a form, the Form Builder shows the ways people can fill it out.

  1. Under Embed on site, select Set it up. If web forms are already on for the form, select Get the code.

The Your form is published dialog with Embed on site selected

  1. If you're asked, turn on the add-on and select Enable Webforms for this form.

  2. Select Copy embed code.

The Embed on your site view with the embed code and the Copy embed code button

This code uses the width and height from Web Forms Settings. Remember to add your website to Allowed Websites there.

Note

The Assistant can't change web form or embedding settings.

What's next