Embed Forms with the Gutenberg Block

Insert the dynamic Smart Form block (dragwyb/form), choose a saved form in Form Settings, and preview its server-rendered output.

Smart Form Builder registers a dynamic WordPress block named Smart Form with the block name dragwyb/form. Select a saved form in the block settings; WordPress renders the form through the plugin’s shortcode handler on the front end.

Insert the Smart Form block

  1. Open the page or post in the WordPress block editor.
  2. Click the block inserter (+) and search for Smart Form.
  3. Insert the block where the form should appear.
  4. In the block settings, open Form Settings and use Select Form to choose the intended form.
  5. Save or update the page, then preview the public page.

Block settings and preview

  • Select Form is the block’s form-selection control. The dropdown labels forms with their title and ID; drafts are marked as drafts.
  • The editor uses a server-side render preview. If no form is selected, the block asks you to select one.
  • If the selected form cannot be rendered or has no published fields, the editor preview displays a form-not-found or no-fields message.
  • The block stores the selected form ID in its formId attribute and renders dynamically rather than saving a static copy of the form HTML.

If the block is missing or empty

  • Confirm Smart Form Builder is active and the editor is the WordPress block editor.
  • Confirm the form exists and is published, with saved fields.
  • Save the page after selecting the form, then check the public page rather than relying only on the editor preview.
  • If a translated form is expected, check the language relationship and the translated form’s publication status. The block calls the shortcode renderer, which contains the translation lookup logic.

Screenshot to add: [Smart Form block Form Settings panel with Select Form control]