Embed Forms in Gutenberg
Guides for embedding Typeform, HubSpot, JotForm, Calendly, and more in Gutenberg using the Custom iFrame WordPress plugin. No coding required.
Overview
Custom iFrame lets you embed forms and scheduling tools in Gutenberg from Typeform, HubSpot, JotForm, Calendly, and more. Paste any form URL into the block. No API keys, no shortcodes, no coding required.
Custom iFrame is a WordPress plugin by CoderzStudio that embeds 100+ external sources in Elementor and Gutenberg without writing any code.
Using Elementor instead? Follow the Embed Forms in Elementor guide.
Requirements
- Custom iFrame plugin installed and active
- WordPress with the Gutenberg block editor
- A shareable URL from your form or scheduling platform
How to Embed a Form in Gutenberg
All form platforms follow the same three-step process.
Step 1: Get the Form Link
Open your form platform
Go to the platform where your form lives: Typeform, HubSpot, JotForm, Calendly, or any other supported source.
Copy the share or embed link
Use the platform's share or publish option to get a public URL. Copy it to your clipboard.
Each platform guide below shows exactly which link to copy.
Step 2: Add the Custom iFrame Block
Open your page in the block editor
Go to the page or post where you want the form. Click Edit to open the Gutenberg block editor.
Add the Custom iFrame block
Click the Add Block button. Search for Custom iFrame. Click the block to add it to the page.
Step 3: Paste the URL and Publish
Paste the form URL
In the right panel, paste the URL into the Source URL field. The form loads inside the block.
Set height and publish
Set Height to show the full form. Taller forms need 700px or more. Click Update or Publish.
Click Update or Publish. Your form is now live and collecting responses on your WordPress site.
Supported Form Platforms
Select your platform for a step-by-step embed guide.
Embed Typeform in Gutenberg
Add surveys, quizzes, and lead forms from Typeform.
Embed HubSpot Form in Gutenberg
Capture leads with HubSpot forms connected to your CRM.
Embed JotForm in Gutenberg
Add contact forms, surveys, and payment forms from JotForm.
Embed Calendly in Gutenberg
Let visitors book meetings directly on your page via Calendly.
Also in Elementor
All form platforms are also supported in the Elementor widget editor.
See Embed Forms in Elementor for all Elementor guides.
Related Guides
Last updated today
Built with Documentation.AI