Capture a form

allGood does not render forms. A form in allGood is a definition — the fields it collects, plus its capture settings. The markup on your page stays yours: your HTML, your CSS, your layout, your validation messages. The script connects the two.

Coming from Marketo Forms 2.0: there’s no embed code that draws a form, nothing to restyle afterwards, and no field mapping step. The nearest equivalent is Forms 2.0’s “submit from your own markup” pattern — except here it’s the only pattern, and it’s fully supported.

The whole integration

There are two tracks, generated from the same drawer (see below). Ready to use gives you a complete form — labeled fields, the right input types, autofill hints, a status message, and a set of hidden tracking fields already wired in — styled with the ag-form-* classes. Minimal gives you just the attribute, for markup you already have:

<!-- once, in <head> -->
<script src="https://mk.brand.com/_ag/v1.js" async></script>

<!-- your own markup, styled however you like -->
<form data-ag-form="f7k2m9qp">
  <label>Email
    <input type="email" name="email" required />
  </label>
  <label>First name
    <input type="text" name="firstName" />
  </label>
  <button type="submit">Request a demo</button>
</form>

<p data-ag-form-status="f7k2m9qp"></p>

Either way, nothing here needs hand-editing once it’s generated — the data-ag-form attribute and matching name attributes are all the script needs. No tracking key is needed for forms. Forms are identified by their own id and gated by the allowed origins list.

Where the form id comes from

Every form has an eight-character short id, minted once and stable across renames and new versions. Find it on the form’s Settings tab, as the Form ID row, next to the full capture endpoint with a copy button.

A form's Settings tab, showing its Form ID, its capture endpoint, and whether it is accepting submissions.

Add it to another site on the form is worth knowing about: Copy install code copies the snippet straight to the clipboard, while Send to your developer opens the full drawer instead, generated from this form’s real configuration — its actual fields, its honeypot name, whether it needs a bot check, and (on the Ready to use tab) a set of tracking fields already filled in — rather than a generic example. A generic example is wrong for most forms in at least one of those, and wrong in ways that produce a silent refusal.

The install drawer, with an embed snippet built from this form's real fields.

The Ready to use tab’s hidden fields — utmCampaign, utmContent, utmMedium, utmOffer, utmSource, utmTerm, gclid, utmPosition, utmDevice, utmType — are filled in from the page’s URL automatically; nothing to wire up. Writing your own markup with Minimal instead? Add whichever of those you want by name yourself — the script picks up any hidden field with a name it recognizes, nothing more.

The attributes

Attribute	On	Purpose
`data-ag-form="{formId}"`	the `<form>`	Binds this form to an allGood form
`data-ag-form-status="{formId}"`	any element	Where the outcome message is written

Leave the status element out if you’d rather write your own copy, and listen for the events below instead.

The default messages

Outcome	Message
Accepted	Thanks! Your submission was received.
Refused as a bot	We couldn’t verify you’re human. Please try again.
Too many attempts	Too many attempts. Please wait a moment and try again.
Failed validation	Please check the form and try again.
Not accepting submissions	This form isn’t accepting submissions from this page.
Anything else	Something went wrong. Please try again later.

A field the visitor can fix — a missing required value, an address that isn’t an email — gets that specific message instead.

Events you can listen for

All three fire on document and bubble.

document.addEventListener("allgood:form:submitted", (e) => {
  const { formId, submissionId, email, redirectUrl } = e.detail;
  // fires only on an accepted submission, and BEFORE any redirect,
  // so a conversion tag still gets to run
  window.dataLayer.push({ event: "generate_lead", form_id: formId });
});

document.addEventListener("allgood:form:rejected", (e) => {
  const { formId, status, errors } = e.detail;
  // errors is present only for problems the visitor can fix
});

document.addEventListener("allgood:ready", (e) => {
  console.log("allGood loaded", e.detail.version);
});

What the script does for you

Collects the fields. Every named, enabled control becomes part of the submission — text, email, hidden fields, textareas, selects, checkboxes as true or false, and the chosen radio option. Everything you put in the form is sent and stored, including hidden fields and UTM values. There is no mapping step. Checks what the visitor can fix. If the form declares its fields, the script checks them before sending — required values, numbers, email format, allowed options — so the visitor gets a fixable message rather than a rejection. Adds the honeypot. A hidden field bots fill and humans don’t. Don’t add your own, don’t style it visible, and don’t let your code write to it. Adds the bot-check widget, if the form requires one, just before the submit button. If it hasn’t finished loading when the visitor submits, the script says so rather than sending a submission that would be refused. Stops double submissions. A form binds once even if the script is included twice, and a second click while the first is in flight is ignored. Two submissions would create two records, and the lead would be counted twice. Gives up after twelve seconds and shows the generic error.

Bot check

If the form requires a bot check, the script places the widget just before the submit button and loads the Cloudflare Turnstile script once per page. Style it with the .cf-turnstile class if you need to move it. The visitor’s browser produces a token, usually without any action, and the script sends it with the submission. If your site sets a Content Security Policy, it has to allow https://challenges.cloudflare.com for both script-src and frame-src. Otherwise the widget never renders and every submission is refused as a bot. See Install the tag. If you build the request yourself, you render the widget and send the token. See the form capture API. An admin turns the check on per form and checks coverage in Turn on bot protection for a form.

Success redirect

A form can carry a redirect for accepted submissions, set on the form itself. The script navigates there for you, and the allgood:form:submitted event fires before it does, so a conversion tag still runs. Because it lives on the form rather than in your markup, changing where visitors land needs no republish of your website. Leave it unset and navigate yourself if you’d rather handle it in your own listener.

Several forms on one page

Fine. Each form carries its own id, and the script asks about all of them in one request, up to ten per page. The same form id can appear more than once — a header call-to-action and a footer one, say — and both bind independently.

Before it will work

What happens to every submission, resolved against one form's real configuration.

Requirement	Check
The form is registered	Its Settings tab reads “Accepting submissions: Registered”. An unregistered form refuses everything
Your origin is allowed	Allowed origins
If a bot check is required, the widget covers this hostname	Otherwise every submission is refused — see Bot protection

If the script doesn’t load

The script prevents the form’s normal submission, so if it never loads, the form falls back to whatever its action says. If you need a no-JavaScript fallback, point action at your own server and post to the form capture API from there.

→ A complete example page, or Troubleshooting.

Marketing Kernel

Platform

Developer

Enterprise

Settings

The whole integration

Where the form id comes from

The attributes

The default messages

Events you can listen for

What the script does for you

Bot check

Success redirect

Several forms on one page

Before it will work

If the script doesn’t load

Next