You can embed forms into your own website, as well as directly inside Safari Portal Content Pages, Itineraries, Lookbooks, and Guest Portals to capture leads or guest information seamlessly. Here's how:

Set Up Your Website Allowlist:

1. Navigate to the Forms module
2. Click the Share button next to any form.
3. Open the Embed tab.
4. Select Edit Allowlist Websites and add up to three website URLs you trust where you would like to embed your forms.
5. • This only has to be done once and will reflect on all forms.
   • Forms can only be embedded on the websites you’ve added.
   • Use full URLs (include https://) and do not add any text after .com (e.g., about-us, contact-us).
   • You can remove or edit URLs later.
6. Click Save.

Custom Form Submissions Can Be Collected Using Two Methods:

Option #1: Collect Submissions Independently

When a contact completes the form, their submission will be automatically attached to their contact profile. Use this option if you plan to embed a form on a website.

1. Navigate to the Forms module.
2. Click Share next to the relevant form.
3. Choose Collect Submissions Independently.
4. Open the Embed tab.
5. Select an embed option:
6. • Responsive Widget: Is intended for use on websites only.
   • Fixed iFrame: Can be used both in Safari Portal and on websites.
   • • Preview how each option will appear on your website: Sample Embed Forms
7. Click Copy to copy the embed code.

Option #2: Assign to a Specific File

When a contact submits the form, it will be automatically attached to the selected File as well as their contact profile.

1. Navigate to the Forms module.
2. Click Share next to the relevant form.
3. Select Assign to a Specific File.
4. Choose the appropriate File from the dropdown menu, then click Confirm.
5. Click the Share button next to the File name.
6. Open the Embed tab.
7. Select Fixed iFrame.
8. 1. The Responsive Widget is only to embed a form on a website.
9. Click Copy to copy the embed code.

Once you’ve selected your embed option, you can use the code in the following ways:

Embed a Form on Your Website

1. Navigate to the Forms module
2. Click the Share button next to the form you want to embed.
3. Select Collect Submissions Independently.
4. Open the Embed tab and select an embed option:
5. 1. • Responsive Widget: Is intended for use on websites only.
      • Fixed iFrame: Can be used both in Safari Portal and on websites.
      • • Preview how each option will appear on your website: Sample Embed Forms
6. Copy the embed code and paste it anywhere on your site where you have access to the source code.
   

Embed a Form in a Proposal or Guest Portal

1. Hover between sections within any page. You will see a blue line with a blue plus button; click the blue plus to launch the Element Library.
2. Select the Forms Element.
3. From the dropdown menu, search for or select the form you want to embed.
   

Embed a Form in a Content Page

1. Create a Miscellaneous Page in your Content Library.
2. 1. Embed the relevant form (e.g., Client Information Form) on the page using the Forms Element.
3. Pull the page into each proposal or Guest Portal on the General Info tab.

Remove or Edit URLs

1. Navigate to a Form.
2. Click the Share button.
3. Go to the Embed tab.
4. Click Edit Allowlist Websites.
5. Make the necessary changes.
6. Click Save to apply your updates.
   

Tips & Tricks 💥

• You can update a form's Submit button settings to automatically send an email after someone submits the form.
• When using Showit or Squarespace, keep in mind they rely on two separate domains. Make sure to add both to your allowlist:
• • Squarespace
  • • Your live website domain, such as https://yourcompany.com
    • Your editor/preview domain, such as https://yourcompany.squarespace.com
  • Showit
  • • Your live website domain, such as https://yourcompany.com
    • Your builder/preview domain, such as https://app.showit.com
• When embedding a form directly into a Guest Portal, or when pulling in an existing Content Page that contains a form, hide the Guest Forms tab.
• • Currently, you can't embed forms via the Guest Forms tab. As a workaround, hide the Guest Forms page, add a standalone Content Page with the embedded form and instructions, then use Add Existing Guest to link it on the Guest Forms tab. (This is a short term work around - we’re working on this part now!)
• To adjust the height of a form, edit the height value in the embed code. For example, change the number from 600 to 400 to reduce the form’s height.
  

Keywords: Custom forms, embed custom form, how to embed form, add form to website, embed form in proposal, create custom form, form on itinerary, form on lookbook, form on guest portal.