You can embed GriffinForms in two ways: the Gutenberg block (recommended for editors) and the shortcode (recommended for templates and classic editors).
Overview
Insert with the Gutenberg block
Use the Gutenberg block when you are working in the block editor:
- Insert the GriffinForms block.
- Select your form in the block sidebar.
- Use the toolbar shortcuts to open Edit Form or Open Form Builder in a new tab.
Embed with shortcode
Use a shortcode when you need to embed inside templates, widgets, or the classic editor:
Example shortcode
[griffinforms_form id=123]
Replace
123 with your form’s ID.Preview limitations in the editor
The block editor preview is lightweight so the editor stays fast:
- Validations, conditional logic, payments, and submissions do not run in the editor preview.
- Always preview the page on the frontend to test the real form behavior.
Frontend testing checklist
Before you publish:
- Preview the page on the frontend and submit a test entry.
- Verify notifications and integrations are configured.
- Check responsive behavior on desktop and mobile.