Embedding forms on your website

Modified on Sat, May 16 at 6:24 PM

Contact and Registration Forms and Surveys

Embedding forms on your website

Quick answer: Open the form in SitesForms, click Integrate, copy the embed code, and paste it into your website builder. Works with WordPress, Squarespace, Wix, Shopify, and most other platforms.

Step 1: Get the embed code

  1. Click Sites in the main menu.
  2. Click Forms in the secondary navigation.
  3. Open the form you want to embed (or create a new one with + Add Form).
  4. Click the Integrate tab in the top right.
  5. Choose your embed style (inline, popup, or other options depending on what you need).
  6. Click Copy Embed Code.

Step 2: Paste it into your website

The embed code is a small JavaScript snippet. Each website builder has its own way to paste in custom code. Here are the most common ones for school websites.

WordPress

  1. In your WordPress admin, navigate to Pages.
  2. Open the page where you want the form. Click Edit.
  3. In the block editor, click the + button to add a new block.
  4. Search for and select Custom HTML.
  5. Paste the embed code into the Custom HTML block.
  6. Click Update to save the page.
  7. Visit the page on your live site to confirm the form appears.

Squarespace

  1. From your Squarespace dashboard, navigate to Settings.
  2. Click Advanced.
  3. Click Code Injection.
  4. Paste the embed code into the Header or Footer section if you want the form available across every page. For a single page, use Per-Page Code Injection in the page's settings.
  5. Click Save.
  6. Publish your site.

Note: Squarespace doesn't support embedding forms on checkout pages.

Wix

  1. Open the page in the Wix editor.
  2. Click the + button to add a new element.
  3. Choose Embed, then Embed a Widget.
  4. Select the Code option.
  5. Paste the embed code and click Update.
  6. Preview the page to confirm the form appears correctly.
  7. Publish your site.

Shopify

  1. Log into Shopify and navigate to Online Store from the left menu.
  2. Click Themes.
  3. Find your active theme and click the three-dot menu next to its name. Select Edit Code.
  4. Locate the theme.liquid file in the Layout section.
  5. Paste the embed code in the <head> tag (for site-wide popups) or wherever you want the form to appear.
  6. Save.

Duda

  1. Open the Duda editor and navigate to the page where you want the form.
  2. From the Widgets panel, drag an HTML Widget onto the page.
  3. Paste the embed code into the HTML widget.
  4. Position the widget where you want it.
  5. Save and publish.

Other platforms

Most website builders support custom HTML or JavaScript embeds. Look for options like "Custom HTML", "Code Injection", "Embed Code", or "HTML Widget" in your platform's editor. The embed code is the same regardless of platform — it just needs to be pasted somewhere your platform allows custom code.

Testing after embedding

Always test after embedding:

  1. Open the page on your live site (not the editor preview).
  2. Submit a test response — use your own email.
  3. Confirm the form data lands in Contacts.
  4. Confirm any automation (thank-you email, notification) fires correctly.

If the form doesn't appear

  • Check the embed code wasn't truncated when you pasted. Re-copy from Growth Suite and re-paste.
  • Check you placed it in the right section. Some platforms have separate sections for header, body, and footer — the form belongs where you want it visible.
  • Republish your site after saving changes. Many platforms cache the live version separately from the editor.
  • Try a different browser to rule out caching issues on your end.

Tips

  • Use unique embed codes for unique forms. If you want different forms on different pages, generate a separate embed code for each.
  • Customize the form's design in Growth Suite first. The embed code carries over the styling — adjusting it after embedding requires updating the form and re-saving.
  • Popup vs. inline: popups are great for high-attention asks (newsletter on exit intent); inline forms are better for forms a visitor has navigated specifically to fill out (like a contact page).

Related articles

  • How to create a contact form
  • Styling and theming forms and surveys
  • Forms and surveys analytics

Was this article helpful?

That’s Great!

Thank you for your feedback

Sorry! We couldn't be helpful

Thank you for your feedback

Let us know how can we improve this article!

Select at least one of the reasons
CAPTCHA verification is required.

Feedback sent

We appreciate your effort and will try to fix the article