Forms on a page — Docs

The block

Search for SendBeam in the block inserter and add SendBeam Form. Pick the form from the dropdown — it lists the forms in the connected workspace, so nobody has to know an ID. If the site's key cannot read forms, the block falls back to a plain ID field and still works.

Editors need no key of their own: the block asks WordPress for the list, and WordPress asks us. The key stays on the server.

Shortcodes

[sendbeam_form] — the default signup form.
[sendbeam_form id="8f3c1a2e-…"] — any specific form, as often as you like.
[sendbeam_contact] — the contact form chosen in settings.
[sendbeam_popup_button label="Subscribe"] — a button that opens a pop-up on a page where it does not appear on its own.

height works on all of them, though you rarely need it — see below. Shortcodes work anywhere shortcodes do: a Shortcode block, a widget, a classic editor, a page builder.

Defaults

Settings → SendBeam → Forms holds the default signup form and the contact form. The block and the shortcodes fall back to these, so most sites choose a form once and never name one again. The Your forms table on the same tab lists every form in the workspace with a ready-made shortcode and a copy button.

Appearance

Forms are served by SendBeam, so by default they carry SendBeam's styling. The Appearance panel on the Forms tab hands the form your site's own: button colour, text colour, field background, field border, corner radius, text size and typeface. Leave a field blank to keep our default.

Set the typeface to Match my theme and the form inherits the font of the page it sits in. The values are validated before they are used — a colour must be a hex value, sizes are clamped, and the typeface is chosen from a list rather than supplied as a font stack.

Hide the form name and subtitle inside the embed is on by default, because the section of your page around the form almost always has its own heading. The Powered by SendBeam line stays.

Height

An embedded form measures itself and tells the page how tall it is, so the plugin sizes the frame to match. You should not need to set a height, and a fixed one only helps if you are deliberately constraining the form. Picking a number by hand leaves either a scrollbar or a band of empty space under the button.

Reacting to a submission

The page fires a sendbeam:submitted event on document when a form in it is submitted, carrying the form ID. Use it to record an analytics goal or move the visitor on.

document.addEventListener('sendbeam:submitted', function (e) {
  // e.detail.formId
  window.dataLayer && window.dataLayer.push({ event: 'newsletter_signup' });
});