Log Gutenberg block form entries in Google Sheets
Use LeadToSheet to capture submissions from native WordPress block editor forms and sync them to Google Sheets without any page builder dependency.
CMS: WordPress
Overview
Gutenberg Forms provides a native block editor form solution where each field is an independent Gutenberg block - no external page builder required. It supports conditional logic, email notifications, form patterns, and reusable block templates. LeadToSheet captures the browser-level submission event and writes every field value to Google Sheets, giving you a centralised lead database that works with the lightweight block editor workflow.
Implementation checklist
- 1
Add the LeadToSheet SDK to your theme footer
Inject the script tag into your theme's footer or use a code snippets plugin. Since Gutenberg Forms renders as standard HTML form elements, the SDK detects them automatically on page load.
LeadToSheet snippet
<script src="https://cdn.leadtosheet.com/sdk.min.js" data-client="YOUR_CLIENT_KEY"></script> - 2
Name each field block explicitly
Select each field block in the Gutenberg editor and assign a meaningful name in the block settings. Gutenberg Forms uses these names in the submission payload, and LeadToSheet maps them directly to column headers in your sheet.
Tip: Use form patterns to create reusable templates with consistent field names across your site.
- 3
Publish the page and submit a real test entry
The block editor preview does not execute form submission handlers. Navigate to the published page URL and submit a complete test entry to confirm the row appears in your Google Sheet.
Customization ideas
Use form patterns for consistent field naming across pages
Gutenberg Forms supports reusable block patterns. Create a pattern with standardised field names so every form on your site produces identical column headers in Google Sheets, making cross-page analysis straightforward.
Capture conditional logic responses as segmentation data
Gutenberg Forms' conditional show/hide logic produces different field sets per submission. LeadToSheet records exactly which fields the visitor filled in, letting you segment leads by their interaction path in the sheet.
Pair with reusable blocks for site-wide form changes
If you manage forms as reusable blocks, a single edit propagates everywhere. LeadToSheet continues capturing submissions from every instance without any reconfiguration, since it listens at the browser level.
Troubleshooting
Form renders in the editor but submissions fail on the frontend
Gutenberg Forms requires its frontend JavaScript to be enqueued. If a performance plugin removes unused scripts, the form's submission handler may not load. Whitelist the Gutenberg Forms plugin scripts in your optimisation settings.
Block editor preview does not trigger LeadToSheet capture
The WordPress block editor renders a design preview that does not execute form submission events. All testing must be done on the published or previewed frontend page in a separate browser tab.
Conditional fields produce missing columns in the sheet
Fields hidden by conditional logic are not included in the submission. Run initial test entries that trigger every conditional branch to ensure all possible column headers are created in your sheet during setup.
Frequently asked questions
- Does Gutenberg Forms work with full site editing (FSE) themes?
- Yes. Gutenberg Forms blocks render identically in classic and FSE themes. LeadToSheet captures submissions from both theme types without any configuration difference.
- Can I capture forms placed inside WordPress block template parts?
- Absolutely. Forms in template parts (headers, footers, sidebars) render as standard HTML on the frontend. The LeadToSheet SDK detects them the same way it detects forms in page content.
- Do I need a page builder to use Gutenberg Forms with LeadToSheet?
- No. Gutenberg Forms is a native block editor solution with zero page builder dependency. LeadToSheet works with the standard WordPress block editor out of the box.