Log in
Log in
ANAPixelsAttributionAnalyticsAds
Z1
AI Storefront Builder
All products
WorkServicesPricingAboutHelp
Get in Touch

Forms

/

3 min read

Collect emails with a popup form

Turn a Zalify popup into an email-capture form that subscribes visitors to a List and fires a lead event.

Add a form to a Zalify popup and the Pixel wires it end-to-end: it collects the fields, submits them to Zalify, subscribes the visitor to a List, and fires a lead conversion event — all without you writing any submit code.

Before you begin

  • A popup to attach the form to — see Create your first popup.
  • A List in Zalify for new subscribers to join.

Set up the form

1

Point the popup at a List

On the popup document, set form: { list_id } with the ID of the List new subscribers should join.

2

Add a form to the popup HTML

Include a <form data-zalify-form> with your inputs. The Pixel wires it automatically — no submit handler needed.

3

Name your inputs

Input name attributes map one-to-one to Zalify's fields. Recognized names:

email, phone, firstName, lastName, language, emailMarketingConsent, smsMarketingConsent.

Any other inputs are ignored, so you can add layout-only fields without polluting the submission.

4

Publish

Publish the popup. Submissions start flowing into Zalify immediately.

What happens on submit

When a visitor submits, the runtime:

  1. collects the form data,
  2. fires a form_submitted event,
  3. POSTs to Zalify's submission endpoint,
  4. fires a lead event on a successful (2xx) response, and
  5. flips the form's data-zalify-form-state attribute through idle → submitting → success | error.

That state attribute lets you style each stage — for example, showing a spinner while submitting and a thank-you message on success — using CSS alone.

The two events

Both events fire so your analytics and ad platforms get clean signals:

EventWhen it firesPayload
form_submittedSynchronously, before the network requestform_id, list_id, and the form fields — captures intent even if the request later fails
leadOnly on a 2xx from the subscribe endpointMinimal — { email } — mapping cleanly to the lead/conversion semantics ad platforms expect

Prefer to use your own form?

If you already have a form on your site — a footer newsletter box, for example — you don't have to rebuild it as a popup. Wire it to Zalify with one call:

window.zalify('wire_form', {
  selector: '#newsletter',
  list_id: 'xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
  form_id: 'footer_signup',
});

It reuses the exact same submission path, events, and state machine as popup forms, works with any framework, and is safe to call before the Pixel finishes booting (the call queues). Full reference: Zalify's forms guide.

Where submissions go

Every submit is stored in Zalify as a Submission, keeping the raw fields verbatim — even if the form isn't subscribing anyone to a List (useful for surveys and lead-gen). When it does subscribe, the visitor's profile is added to your List and automatically matched into any Segments whose rules they meet.

Turn a submit into a journey

A new subscriber joining a List can kick off an automation Flow — for example a welcome email. Set that up once and every popup or wired form that feeds the List triggers it.

Next steps