How to Embed and Customize Google Forms in WordPress (No Plugins Required)
To embed a Google Form in WordPress without a plugin: connect the form to CustomGForm, style it, copy the embed snippet, and paste it into a Custom HTML block (Gutenberg), an HTML widget (Elementor), or the Text tab (Classic Editor). The form then renders natively in your theme and responses still go to your Google Form and Google Sheet.
Embedding a default Google Form into WordPress usually means dealing with an ugly, unstyled iframe that doesn't match your theme, adds duplicate scrollbars on mobile, and displays prominent Google branding.
With CustomGForm, you can transform any Google Form into a native, beautifully styled WordPress form in under 60 seconds — without installing bloated plugins that slow down your site or cause security vulnerabilities.
Live Interactive Preview
Test this live interactive form directly on this page. Responses automatically sync in real-time to your Google Sheets:
This responsive form is powered by Google Forms backend and renders natively on your WordPress site without iframes.
Why CustomGForm Over WordPress Form Plugins?
| Feature | Standard Google Forms iframe | Typical WP Form Plugin (WPForms / Gravity) | CustomGForm |
|---|---|---|---|
| Site Speed Impact | Extra iframe load and fixed Google styling | Heavy DB queries & assets on every page | No WordPress plugin or database load (one CDN script) |
| Theme Matching | Clashing purple Google header | Requires custom CSS tweaks | Automatic font & color palette matching |
| Mobile Experience | Awkward double scrollbars | Good, but plugin-dependent | 100% responsive & fluid mobile layout |
| Data Storage | Google Sheets | Local WP database (backup risk) | Google Sheets + instant email / webhook alerts |
| Plugin Vulnerabilities | None | Frequent security patches needed | Zero plugins installed on your WordPress |
How Do You Embed a Google Form in WordPress? (3-Step Setup)
Step 1: Connect & Style Your Google Form
- Go to the CustomGForm Dashboard and paste your public Google Form link.
- CustomGForm automatically imports your questions, dropdowns, and validation rules.
- Customize your design: choose typography matching your WordPress theme, pick your brand primary color, adjust input border radius, or switch to dark mode.
Step 2: Copy Your Embed Code
Choose how you want the form to appear on your WordPress site:
Add this standard embed code anywhere inside your page, post, or sidebar widget:
<!-- CustomGForm Standard Embed -->
<div data-customgform="YOUR_FORM_ID"></div>
<script async src="https://cdn.customgform.com/cgf.js"></script>| Option | Type | Description |
|---|---|---|
| data-customgform | string | Your unique CustomGForm Form ID (found in dashboard) |
| data-prefill_fields | string | Optional: Query or field values to prefill (e.g. 261034186=WordPress) |
| data-theme | string | Optional: Force "light" or "dark" theme mode |
Replace YOUR_FORM_ID with the ID generated in your CustomGForm dashboard (e.g. cme8v3p530011wnq8z6hscwfa).
Step 3: Paste into Your WordPress Page or Post
Depending on which WordPress editor you use:
Option A: WordPress Gutenberg Block Editor (Default)
- In your WordPress admin, open the Page or Post where you want the form.
- Click the
+(Add Block) icon and search for Custom HTML. - Paste your CustomGForm embed code into the block.
- Click Preview or Update. Your customized form is now live!
Option B: Elementor Page Builder
- Open the page in Elementor editor.
- Search the left widget panel for the HTML widget.
- Drag the HTML widget into your desired column or container.
- Paste the snippet into the HTML Code textarea and click Update.
Option C: Classic WordPress Editor
- In the editor toolbar, switch from the Visual tab to the Text (HTML) tab.
- Paste the embed code where you want the form to render.
- Click Update or Publish.
Pro Tips for WordPress
- Full-Width Layouts: Place the
<div>inside a container block set to wide or full-width alignment for seamless landing page hero forms. - Custom Redirects: Configure CustomGForm in your dashboard to redirect users to a custom WordPress "Thank You" page upon successful submission.
- Hidden UTM Parameters: Track traffic sources (e.g.
utm_source=google,utm_campaign=summer) by enabling hidden fields that pass directly into your Google Sheets spreadsheet.
Related Guides
- How to embed a Google Form in any website
- Embed Google Forms in Wix
- Embed Google Forms in Squarespace
- WordPress embed code quickstart
Add Custom Google Forms to WordPress in 60 Seconds
No plugins, no database bloat, no clunky iframes. Free plan available forever.
Last updated on
WordPress Quickstart – CustomGForm Embed Code
Learn how to embed CustomGForm in your WordPress website using the Custom HTML block in standard or popup modal mode.
The Complete Guide to Styling Google Forms in Webflow
Step-by-step tutorial to embed, style, and integrate Google Forms inside Webflow designer with custom fonts, colors, and responsive layouts.