> For the complete documentation index, see [llms.txt](https://docs.customiframe.com/llms.txt).
> Use it to discover all available pages before exploring further.

# Embed Google Form in Elementor

Step-by-step guide to embed Google Form in Elementor using the Custom iFrame WordPress plugin. Collect responses on your site. No coding required.


## Overview

Custom iFrame lets you embed Google Form in Elementor by pasting a form link into the widget. Collect feedback, surveys, and registrations directly on your WordPress page without an API key.

Custom iFrame is a WordPress plugin by CoderzStudio that embeds 100+ external sources in Elementor and Gutenberg without writing any code.

Using Gutenberg instead? Follow the [Embed Google Form in Gutenberg](/gutenberg/documents/embed-google-forms) guide.

## Requirements

- [Custom iFrame plugin installed and active](/getting-started/installation)
- Elementor installed
- A published Google Form

## Video Tutorial

<iframe
  src="https://www.youtube.com/embed/ag_B1EJtiss"
  width="720"
  height="405"
  frameBorder="0"
  allowFullScreen
/>

## Step 1: Get the Google Form Link

<Steps>
  <Step title="Open your Google Form" icon="file-text" title-type="p">
    Open the Google Form you want to embed in Google Forms.
  </Step>
  <Step title="Publish the form" icon="globe" title-type="p">
    Click the **Publish** button in the top right corner. A Publish Form popup opens. Click **Publish** again to confirm.
  </Step>
  <Step title="Copy the responder link" icon="link" title-type="p">
    Click the **Published** button that now appears. Click **Copy Responder Link**. This is the URL you will paste into Custom iFrame.
  </Step>
</Steps>

## Step 2: Add the Custom iFrame Widget

<Steps>
  <Step title="Open your page in Elementor" icon="layout" title-type="p">
    Go to the page where you want the form. Click **Edit with Elementor**.
  </Step>
  <Step title="Drag the widget onto your page" icon="move" title-type="p">
    Search for **Custom iFrame** in the Elementor widget panel. Drag the widget into your layout.

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776867149/getting-started/elementor-setup/Guide-Add-Custom-iFrame.webp"
      alt="Custom iFrame widget being dragged from the Elementor panel into a page section in the editor"
      width="1024"
      height="337" priority={true} fetchPriority="high" />
  </Step>
</Steps>

## Step 3: Embed Google Form in Elementor

<Steps>
  <Step title="Paste the Google Form URL" icon="clipboard" title-type="p">
    In the Content tab, paste the responder link into the **Source URL** field. The form appears in the editor.

    <Image
      src="https://res.cloudinary.com/dcn414hjc/image/upload/v1776912783/elementor/documents/google-forms/embed-google-form-link.webp"
      alt="Custom iFrame widget in Elementor editor showing Google Form URL in Source URL field with live Google Form preview"
      width="1024"
      height="468" priority={true} fetchPriority="high" />
  </Step>
  <Step title="Set the height" icon="move-vertical" title-type="p">
    Set **Height** to fit your form length. Longer forms need 800px or more.
  </Step>
</Steps>

## Step 4: Customize and Configure Settings

For styling, smart loading, and advanced options, see the [Style Custom iFrame](/getting-started/styling) guide. Adjust dimensions, backgrounds, borders, and more.

## Step 5: Save and Publish

<Callout kind="success">
  Click **Update** or **Publish**. Your Google Form is now live on your WordPress site.
</Callout>

Want to add a custom watermark (Pro), device frame (Pro), or fine-tune widget behavior? See the [Set Up Custom iFrame in Elementor](/getting-started/elementor-setup) guide for all widget options.

This guide showed you how to embed Google Form in Elementor using the Custom iFrame plugin. From publishing the form to pasting the responder link and updating the page, the whole setup runs through the Elementor editor without any code.

## FAQ

<ExpandableGroup>
  <Expandable title="Do I need a Google account to embed a Google Form?" default-open="false">
    You need a Google account to create and publish the form. Visitors who fill out the embedded form do not need an account.
  </Expandable>
  <Expandable title="Will form responses go to Google Sheets automatically?" default-open="false">
    Yes. If you linked your form to a Google Sheet, all responses submitted through the embedded form appear in that sheet automatically.
  </Expandable>
  <Expandable title="The Google Form shows blank. What should I check?" default-open="false">
    Confirm you used the **Responder Link**, not the editor URL. The responder link goes to `docs.google.com/forms/d/.../viewform`. Test it in a private browser window to verify it loads without login.
  </Expandable>
  <Expandable title="What height should I set for a Google Form?" default-open="false">
    Short forms with 3-5 questions need around 500px. Longer forms need 800px to 1200px. Enable Auto Height to let the iFrame resize automatically.
  </Expandable>
</ExpandableGroup>

---

## Also Available For

<Columns cols="2">
  <Card title="Embed Google Form in Gutenberg" href="/gutenberg/documents/embed-google-forms" icon="layout" horizontal={false}>
    Guide for the WordPress block editor.
  </Card>
  <Card title="Embed Google Docs in Elementor" href="/elementor/documents/embed-google-docs" icon="file-text" horizontal={false}>
    Embed Google Docs in Elementor.
  </Card>
</Columns>

## Related Guides

- [Embed Documents in Elementor - Overview](/elementor/embed-documents)
- [Embed Google Docs in Elementor](/elementor/documents/embed-google-docs)
- [Embed Google Sheets in Elementor](/elementor/documents/embed-google-sheets)
- [Auto Height Adjustment](/features/auto-height)
- [iFrame Not Showing](/troubleshooting/iframe-not-showing)