How to Embed a Google Form on Any Website in 4 Steps

· 16 min read

Yes, you can embed a Google Form on any website. Google Forms generates a standard iframe snippet that works in plain HTML, WordPress, Squarespace, Wix, and anywhere else you can paste code. The catch in 2026: the embed option moved. You now publish the form first, then copy the code from the More menu.

That change trips people up, because most older tutorials still point at a Send button and a < > embed tab that no longer exist. This guide covers the current flow: getting the code, adding it to HTML, WordPress, Squarespace, and Wix, handling file uploads, and fixing broken embeds.

How Do You Get the Embed Code from Google Forms?

Publish the form first: click Publish in the top-right corner of the form editor and confirm who can respond. Then click the three-dot More menu, also top right, and select Embed HTML. Click Copy and you have your iframe code. The old Send-button embed tab is gone for most accounts.

Step 1: Open your Google Form

Go to forms.google.com and open the form you want to embed, or click Blank to build one. If people outside your organization need to fill it in, check the responder access settings first; our guide on how to make a Google Form public walks through those options.

Step 2: Publish the form

Click Publish in the top-right corner of the form editor. A dialog confirms who can respond; click Manage if you need to open the form beyond your organization. Confirm, and the button changes to Published.

This step is not optional. An unpublished form won't accept responses, even if the embed code is already on your website.

Google Forms Send button and sharing panel

Still seeing a Send button instead of Publish? You're on the older interface, which Google has been retiring account by account. Click Send, choose the < > tab, and copy the code there; everything after this section works the same. (I kept clicking where Send used to be for weeks, so no judgment.)

Step 3: Select Embed HTML from the More menu

Back in the form editor, click the three-dot More menu in the top-right corner and select Embed HTML. Google displays the iframe code, which looks like this:

<iframe src="https://docs.google.com/forms/d/e/YOUR_FORM_ID/viewform?embedded=true" width="640" height="480" frameborder="0" marginheight="0" marginwidth="0">Loading…</iframe>

Click Copy.

Google Forms embed code with HTML iframe snippet

Step 4: Adjust the dimensions

The snippet comes with fixed width and height attributes; edit those numbers directly in the code after you paste it. Short forms are fine at the stock size, but longer forms need more height or visitors get an internal scrollbar.

Embed a Google Form in HTML

If you're working with a static HTML site or any page where you can edit the source code, embedding takes about 30 seconds.

Paste the iframe code into the page source wherever the form should appear. Wrap it in a container div for easier styling:

<div style="max-width: 700px; margin: 0 auto;">
  <iframe
    src="https://docs.google.com/forms/d/e/YOUR_FORM_ID/viewform?embedded=true"
    width="100%"
    height="800"
    frameborder="0"
    marginheight="0"
    marginwidth="0"
    style="border: none;">
    Loading…
  </iframe>
</div>

Making the embed responsive

Set width="100%" so the form fills its container. For height, there's no auto-resize for cross-origin iframes, so estimate based on form length:

  • Short form (3-5 questions): height="500"
  • Medium form (6-12 questions): height="800"
  • Long form (12+ questions): height="1200" or higher

If you want the iframe to be fully responsive on mobile, use a CSS wrapper that maintains an aspect ratio:

<style>
  .google-form-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
    padding-top: 120%; /* adjust ratio as needed */
  }
  .google-form-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
  }
</style>

<div class="google-form-wrapper">
  <iframe
    src="https://docs.google.com/forms/d/e/YOUR_FORM_ID/viewform?embedded=true"
    allowfullscreen>
    Loading…
  </iframe>
</div>

Embed a Google Form in WordPress

WordPress strips raw HTML from standard paragraph blocks, so you need a specific block or editor mode depending on your setup.

Block Editor (Gutenberg)

  1. Open the page or post in the Block Editor.
  2. Click + to add a new block and search for "Custom HTML."
  3. Paste the Google Forms iframe code into the block.
  4. Click Preview to verify the form renders correctly, then publish or update the page.

Set the iframe width to 100% so the form fills the content area whatever your theme's layout width.

Classic Editor

  1. Open the page or post in the Classic Editor.
  2. Switch to the Text tab. The Visual tab strips iframe tags.
  3. Paste the iframe embed code where you want the form to appear.
  4. Switch back to Visual to preview, then publish.

If the form disappears after saving, a security plugin like Wordfence or iThemes Security is likely stripping iframes; whitelist docs.google.com in its settings.

Elementor

  1. Open the page in Elementor's visual editor.
  2. Drag an HTML widget onto the page.
  3. Paste the iframe code and set width to 100%.
  4. Adjust the height in the iframe code until the full form is visible without scrollbars.

Elementor has no native Google Forms widget, so the HTML widget is the correct approach.

Embed a Google Form in Squarespace

Squarespace renders Google Forms through its Code block. One check before you start: per Squarespace's docs, iframes in Code blocks only work on paid plans (Core, Plus, Advanced, Business, and Commerce). On other plans the block accepts the code but won't render the form.

  1. Open the page in the Squarespace editor and click Add block (the +).
  2. Select Code from the block menu.
  3. Click the pencil icon on the block to open the code editor.
  4. Paste the Google Forms iframe code into the text field.
  5. Leave Display Source switched off. Turning it on prints your code as formatted text instead of rendering the form.
  6. Save and view the page.

Some embeds show as an empty box inside the editor and only render on the saved page, so check the live URL before calling it broken. Set the width to 100% since section widths vary by template, increase the height until the whole form shows, and check the page on a phone; Squarespace stacks blocks into a single column on mobile.

Embed a Google Form in Wix

  1. Open the Wix Editor and click Add Elements (+).
  2. Select Embed Code > Embed HTML.
  3. Paste the Google Forms iframe code into the code field.
  4. Resize the element by dragging its corners to fit the form.
  5. Preview and publish.

In Wix, the embed element has fixed dimensions on the canvas, so resize it manually and check both desktop and mobile views to make sure the form is fully visible.

Can You Embed a Google Form in an Email?

Not with the iframe code. Gmail, Outlook, and Apple Mail strip iframes and scripts from email content for security reasons, so pasted embed code arrives invisible or broken. Google Forms can include a fillable copy of the form in its own notification emails instead: publish the form and notify responders by email.

In the current interface, email runs through publishing and sharing rather than a separate Send dialog:

  1. Click Publish. In the publish dialog, check "Notify these responders," add addresses, and click Publish and notify.
  2. Already published? Click Share, add people with the Responder access level, check "Notify people," and send.

Google Forms Send via email dialog

The notification email includes the form itself, so recipients can start answering without leaving their inbox. Google's help docs list the exceptions: a form with a file upload question, a rating question, an image in a question or an option, or a secured quiz can't be embedded in email, and recipients get a link instead. The inline version works best in Gmail; other clients often fall back to a link anyway.

Google Forms include form in email option

On the older interface, the same thing lives in the Send dialog's email tab as the "Include form in email" checkbox. Same result, different door.

How Do You Embed a Google Form with File Upload?

You embed it the same way, but with a catch: every respondent must be signed in to a Google account before the file upload question will accept anything, and that rule applies inside the embedded iframe too. For public website forms, that sign-in wall costs you submissions, so plan around it.

You add the question by selecting "File upload" as the question type. The sign-in requirement is a hard limit, not a setting you can switch off. For a detailed walkthrough of the feature and its restrictions, see our guide on file uploads in Google Forms.

A visitor who isn't signed in can still fill out text and multiple-choice questions inside the iframe, but the file upload stays locked behind a Google authentication prompt.

Google Forms sign-in requirement for file upload

For public-facing forms like client intake or vendor submissions, this is a deal-breaker. Many external visitors don't have a Google account or won't bother authenticating just to submit a document. Drop-off spikes the moment a login wall appears.

What to do if you need file uploads without sign-in

If collecting files from external users is core to your form, File Request Pro gives you branded upload pages that anyone can use, no account required. Visitors fill in the fields, drag in their files, and submit.

File Request Pro upload page with no sign-in required

Key differences from Google Forms file uploads:

  • No sign-in required: external clients, vendors, and the public can upload files immediately.
  • Large file support, up to 5 GB per upload.
  • Uploaded files sort themselves into folders by respondent name, date, or custom field.
  • Files route directly to your Google Drive, OneDrive, or SharePoint. For more on direct uploads, see our guide on uploading files to Google Drive.
  • Upload pages embed on your website via iframe, the same way Google Forms does.

File Request Pro page builder with form fields and upload section

If your embedded form needs both questions and files from people outside your organization, that's a more reliable setup than fighting Google's sign-in requirement.

Customizing Your Embedded Google Form

The iframe embed code gives you a few ways to control how the form appears on your page.

Width and height

These are the two most common adjustments. Set width="100%" to make the form responsive, and increase the height until the entire form shows. There is no auto-height option, so test after embedding: if a scrollbar appears inside the iframe, add 200-400 pixels of height.

Removing the border

Add frameborder="0" and style="border: none;" to the iframe tag to remove any visible border around the embedded form:

<iframe src="YOUR_FORM_URL" width="100%" height="800" frameborder="0" style="border: none;"></iframe>

Pre-filling form fields via URL parameters

Google Forms can pre-fill answers through URL parameters, useful when you already know the respondent's name, email, or a project reference.

To get the pre-fill URL:

  1. Open your form and click the three-dot More menu in the top right.
  2. Select "Get pre-filled link."
  3. Fill in the answers you want to pre-populate and click "Get link."
  4. Copy the generated URL; it will contain parameters like &entry.123456=John+Doe.

Use this pre-filled URL as the src in your iframe code. Each visitor will see the form with those fields already filled in:

<iframe src="https://docs.google.com/forms/d/e/YOUR_FORM_ID/viewform?embedded=true&entry.123456=John+Doe" width="100%" height="800" frameborder="0"></iframe>

For dynamic pre-filling, where values change per visitor, you'll need a small script that builds the URL before rendering the iframe.

Theming and visual customization

Google Forms has built-in theme options (header image, accent color, background color, font style) that you set in the form editor under the palette icon. These styles carry over to the embedded version.

You can't apply custom CSS to the content inside the iframe; cross-origin browser restrictions block it. But you can style the container around it (backgrounds, padding, shadows) to match your site's design.

Troubleshooting Common Issues

If your embedded Google Form doesn't load, looks broken, or behaves unexpectedly, check these causes in order.

1. Embed code not working, or you can't find the embed option

Symptom: You pasted <iframe src="https://docs.google.com/forms/d/e/..."> into your site and the form won't take responses, or you can't find the embed option in the form editor.
Cause: Google redesigned the sharing flow. Forms must now be published before they accept responses, and the embed code moved out of the Send dialog.
Fix: Two checks. First, publish the form: click Publish in the top-right corner of the editor. An unpublished form won't accept responses even when the iframe loads. Second, get fresh code from the More menu (three dots, top right) > Embed HTML. Any instructions pointing to Send and a < > tab describe the old interface.

2. Form shows as a blank white space

Symptom: The iframe area is empty. No form, no error, just white space.
Cause: Your site's Content Security Policy (CSP) is blocking the iframe.
Fix: Add docs.google.com to your CSP frame-src directive:

Content-Security-Policy: frame-src 'self' https://docs.google.com;

If you don't manage CSP headers directly, look in your hosting platform's security settings.

3. Internal scrollbar appears inside the form

Symptom: The form loads but is cut off, with a scrollbar inside the iframe.
Cause: The iframe height is too small for the form content.
Fix: Increase the height value. Start with height="1000" and adjust up or down. For multi-page forms, set the height based on the longest page.

4. Form doesn't display on mobile

Symptom: The form is cut off or requires horizontal scrolling on phones.
Cause: The iframe has a fixed pixel width.
Fix: Change width="640" to width="100%" and make sure the parent container doesn't constrain it with a narrow max-width.

5. "You need permission" or login prompt

Symptom: Visitors see a Google sign-in page instead of the form.
Cause: The form is restricted to your organization or requires sign-in.
Fix: Click Published in the top-right corner, then Manage, and make sure responder access isn't limited to your Google Workspace domain. Also check the form's settings and uncheck "Limit to 1 response," which forces sign-in.

6. Form disappears after saving in WordPress

Symptom: You paste the iframe in WordPress, save, and the code is gone.
Cause: The Visual editor or a security plugin stripped the iframe tag.
Fix: Use the Custom HTML block in Gutenberg, or switch to the Text tab in the Classic Editor. Whitelist docs.google.com in any security plugins.

7. Form loads on your computer but not for visitors

Symptom: Works in your browser but visitors report a broken form.
Cause: You're signed in to Google, so restricted forms load for you. Visitors aren't signed in.
Fix: Test in an incognito/private window where you're not signed in to any Google account. Fix any access or publishing settings that appear.

Quick reference

Symptom Likely Cause Fix
Can't find the embed option UI redesign moved it More menu (three dots) > Embed HTML
Form won't accept responses Form not published Click Publish in the form editor
Blank space CSP blocking iframe Add docs.google.com to frame-src
Internal scrollbar Iframe height too small Increase height attribute
Cut off on mobile Fixed pixel width Set width to 100%
Login prompt Form requires sign-in Adjust responder access settings
Disappears in WordPress Editor stripping iframes Use Custom HTML block
Works for you, not visitors You're signed in to Google Test in incognito window

Google Forms Alternatives for Embedded Website Forms

Google Forms works for simple surveys and internal feedback forms. But if you're embedding a form on a client-facing website, you'll hit three limitations: no white-labeling (the Google branding always shows), limited design customization, and the sign-in requirement for file uploads.

If your embedded form needs to collect data from external users, especially files, a dedicated form builder gives you more control. And if your organization runs on Microsoft 365, the same embed logic applies with different menus; see our guide on how to embed a Microsoft Form.

File Request Pro is built for collecting files and form data from people outside your organization. Upload pages carry your logo and brand colors, embed on any website via iframe, and don't require respondents to create an account or sign in. Files go straight to your Google Drive, OneDrive, or SharePoint.

That makes it a better fit for client intake forms, document collection workflows, and any situation where the people submitting the form aren't part of your Google Workspace.

Frequently Asked Questions

Where is the embed option in Google Forms now?

Click the three-dot More menu in the top-right corner of the form editor and select Embed HTML. Publish the form first or it won't accept responses. The embed tab that used to sit in the Send dialog was removed in the redesigned interface.

Can I embed a Google Form on any website?

Yes. The embed code is a standard iframe that works on any site where you can add custom HTML: WordPress, Squarespace, Wix, Webflow, Shopify, or hand-coded pages. Your site must use HTTPS, and its Content Security Policy must allow iframes from docs.google.com.

Do respondents need a Google account to fill out an embedded form?

Not for standard questions (text, multiple choice, checkboxes, dropdowns), as long as responder access isn't restricted to your organization. If the form creator has enabled "Limit to 1 response" or added a file upload question, respondents will need to sign in with a Google account.

Can I embed a Google Form without the Google branding?

No. A "Google Forms" footer appears at the bottom of every form, including embedded ones. You cannot remove it. Google Workspace accounts can replace it with their organization's name, but the footer area stays.

Does the embedded Google Form work on mobile devices?

Yes. Google Forms is mobile-responsive by default. Set the iframe width to 100% so the form adapts to the screen size. Avoid setting a fixed pixel width, which causes horizontal scrolling on phones.

Will responses from the embedded form show up in my Google Forms dashboard?

Yes. Responses from embedded forms are identical to those submitted via a direct link. They appear in the same Responses tab and export to the same Google Sheet.

Can I embed multiple Google Forms on one page?

Yes. Each iframe is independent. But multiple iframes increase page load time, especially on mobile. Test the page speed if you're adding more than two forms.

Is it possible to embed a Google Form without an iframe?

Technically, yes, but it takes serious work. You would need a custom HTML form that submits directly to Google's backend using the correct field names, and it breaks whenever Google changes their form processing endpoints. For most use cases, the iframe embed is the reliable choice.

How do I stop the embedded form from showing a scrollbar?

Increase the iframe's height attribute until the entire form fits without scrolling. There's no auto-height for cross-origin iframes, so test different values. Adding scrolling="no" hides the scrollbar entirely, but only use it once the height already shows everything.

More Articles

Ready to streamline your document collection?

Try File Request Pro free and start collecting files from clients in minutes.

Start Free Trial