Your First Website Form

A website form is one you build inside EventsIQ and embed on a site you control. This page walks the whole path in order: create it as a draft, build it, decide where its leads go, go live, put it on a page, and check that a real lead arrived.

Budget about fifteen minutes the first time.

Step 1: Start a new form

Go to Forms. This page is your inventory: every website form, Facebook form, TikTok form, Google lead form and inbound endpoint you have, with its status, what it routes to, and how many leads it has taken.

Press New form. The first screen, Basics and starting point, asks three things.

Form name is for you. It appears in the Forms list and nowhere a visitor can see.

Where will people fill it in? Choose Website.

Start from is a gallery of real, complete forms you can edit down: lead forms, quizzes, call forms and your team's own templates. Search it, or narrow it with the chips at the top, and the preview beside it shows the form as visitors will see it. Simple lead form comes first, marked Recommended. Starting from a template and deleting what you do not need is usually faster than starting blank.

There is no Form ID box. EventsIQ makes one from the name, and you can change it in Settings until the form first goes live.

Step 2: Decide where the leads go

Pick a routing and this form's leads run through it the moment they arrive. The panel beside it shows What happens to a lead, and See it as a map draws the same thing as a picture.

Under that, Fields this routing needs compares the template with what the routing's destinations and presets read. Anything the template does not ask for is marked Missing, and one click adds the question to your form, so a destination does not start turning leads away later.

No routing yet? New routing and Start from a copy open the routing builder over this screen. Close it and you come back here with the new routing picked.

Press Decide later and the form still works: leads are captured, cleaned up and saved in Logs, they are simply never sent to a destination. You can pick a routing later in the editor's Settings, under Where leads go.

Press Create form with this routing (or Decide later) and the form is made as a Draft. A draft shows nothing on any page until you press Go live, so you can build it in peace. The last screen says so, and gives you Open the editor.

Step 3: Build the form

The editor opens in Simple. Along the top are the form's name and status, Search questions and settings (⌘K), the Simple and Advanced switch, undo and redo, Preview, and Go live. Once the form is live that button becomes Live, or Update live form when you have changes, and its menu holds Put it on your page, Versions and Take offline. Down the left are the pages: Questions, Design, Rules, Endings and Settings.

The status always says where the form stands:

• Draft: only your team sees it. Visitors see nothing.
• Live: visitors see exactly what is in the editor.
• Live with 2 changes not live yet: you have edited a live form. Visitors keep seeing the live copy until you press Update live form.

Simple and Advanced edit the same form. Switch at any time from the top bar: what you had selected stays selected, and the editor remembers your choice next time. Simple shows the everyday settings. Advanced is the full builder: Layers in place of Questions, with the whole form as a tree you can drag, every style setting, raw HTML blocks, and a Developer page with custom CSS, screen keys and page values. Most forms never need it. Forms lists every part of both.

Questions and screens

The Questions page lists your form screen by screen, with the questions on each one. The form itself sits beside the list, exactly as it will look on your website. Click anything on it to select it, or double-click a question, heading or button to change its words in place. Enter, Esc or a click anywhere else saves, and Undo puts the old words back.

Add question or block, or the / key, opens a searchable list in groups: Contact details, Questions, Legal and trust, Tracking and Layout. Contact details arrive ready to use, with a real label, marked required, and already named the way destinations expect. Add a screen adds a question screen, or a loading screen that shows a few lines in turn and then moves on by itself.

Select a question and its settings open on the right:

• Question, Help text and Required are the everyday settings.
• Answers, on a choice question, lists each answer with Then go to, which sends people to another screen, and Not a fit, which ends the form there.
• Destinations receive it as is the standard field this answer fills. Set the phone question to phone and every preset, destination template and event that reads {{phone}} finds it. See Fields for the full list.
• The rest, such as More options and Look of this question, sits in sections further down. Open them when you need them.

Rules

A form with several screens is a funnel, and rules decide where each visitor goes next. The Rules page lists every rule as a plain sentence, grouped by the screen it runs on, such as When State is not one of TX, FL, AZ, end with Not a fit. Press Add a rule here beside a screen, or Add a rule at the top, to make one.

When someone presses Continue, EventsIQ checks in this order, and the first match wins:

1. The answer they picked. Any Then go to or Not a fit set on that answer.
2. That screen's rules, top to bottom.
3. The next screen in order, if nothing above matched.

A rule can Go to screen, Skip screen, End with Not a fit or Submit now, and it can read any answer from any earlier screen. See it as a map draws the whole flow. A rule that points at a question or screen you have since deleted is flagged, so it cannot quietly stop working.

Endings

Endings is the one place for what people see when the form is over, and what happens to their lead:

• Thank you: after they submit. The lead is sent, unless you choose to keep it in Logs. Show a message, or send them to another page.
• Not a fit: when an answer, a rule or a button ends the form. The lead is not sent, and the page lists every answer, rule and button that leads here.
• Could not send: when sending fails. The form stays open so they can try again.
• Personal messages show a different message to people who gave particular answers.

Design and Settings

Design sets the look of the whole form: a preset, brand colours, bands, type, shape, density, buttons and the back link. Choices decides how answers are drawn (List, Card or Filled, one or two per row), which is the setting that most changes how a form performs. Card makes the whole answer tappable with a drawn tick instead of a small round button, and on a phone that is often the difference between a funnel that converts and one that does not. List remains the default and is the better choice for long lists and for keyboard users. To style one question, click it on the form.

Settings is one page with a section for each job:

• Basics: the form's name, a description for your team, and the Form ID.
• Where leads go: the routing, and the field names each destination expects.
• Behaviour: saving progress, going back, and step numbers.
• Spam protection: a Hidden trap field and a Minimum time to finish. Both are checked on our server, so obvious bots are turned away even if they skip the form.
• Tracking: extra click ID names, and looking up the full location.
• Who can submit: the websites allowed to send leads with this form.
• Scripts: tracking scripts, and code that runs after a lead is sent.

Step 4: Go live

Press Go live. EventsIQ checks the draft and lists anything that needs a look, in plain words, in four groups: Questions (rules and endings included), Consent, Where leads go and Put it on your page.

• Must fix stops the form going live. Press Fix and the editor takes you to the right place.
• Worth a look is your call and does not stop anything.

When nothing must be fixed, press Go live in the window. The form becomes version 1, visitors can see it, and it starts taking leads. A copy is kept in Versions.

Once a form is live:

• Versions lists every version that went live. Restore as draft copies one into your draft as a single step you can undo. Nothing changes for visitors until you press Update live form.
• Take offline, in the Live menu, stops new leads. Nothing is deleted: pages that show the form say it is unavailable, the leads you have stay in Logs, and it frees one of the live forms on your plan.

Drafts are unlimited. If every live form on your plan is in use, Go live says so: take another form offline or upgrade your plan.

Step 5: Put it on your site

Pick Put it on your page in the Live menu, or search for it with ⌘K while the form is still a draft. The window shows the code, and Copy code copies all of it.

1<link rel="preconnect" href="https://app.eventsiq.io" crossorigin>
2
3<div id="your-form-id" style="min-height:320px"></div>
4
5<script defer
6  src="https://app.eventsiq.io/embed.js"
7  data-form-id="your-form-id"
8  data-min-height="320"></script>

Paste it wherever the form should appear: a WordPress page or post in a Custom HTML block, a raw HTML template, anything that lets you put a script tag on a page. You can paste it while the form is still a draft, but the page shows nothing until you go live. You only paste it once: later changes reach every page when you press Update live form.

Line by line, in plain words explains what each line does, and Page values shows how one form can say something different on each page. Under Where it is used, add the address of each page you pasted the code into. It is a note for your team, and it warns you if that website is not allowed to submit the form.

A few things worth knowing about the embed:

• It has no dependencies. No jQuery, no framework, nothing to install.
• It renders inside a shadow root, so your site's CSS cannot leak in and break the form, and the form's CSS cannot leak out and break your site.
• Several forms can share one page. Paste the code for each, and their Form IDs keep them apart.
• The <div> is optional. If it is absent, the script creates its own container where it sits.

For developers: the script's JavaScript names

Most sites never need these. If your page talks to the embed directly, use the EventsIQ names:

Choosing which sites may submit

By default a live form accepts leads from any website. To lock it to your own, open Settings in the editor and add them under Who can submit. This applies straight away: it does not wait for Update live form.

Step 6: Check that it worked

Fill the form in yourself, on the real page, and then open Activity → Lead logs.

The Lead logs tab has one row per lead. Click it to open everything EventsIQ knows about that lead: the cleaned-up data beside the raw data it arrived as, any field warnings, and the full waterfall: every destination called, in order, with the response each one gave and what EventsIQ concluded from it.

If the lead is there but the sale column says nothing was sold, the lead arrived fine and the routing is what needs attention: start with Destinations.

If the lead is not there at all, the submission never reached EventsIQ. Check that the form is live rather than a draft, that Taking leads is switched on, and that the page's website is allowed under Who can submit.

What to read next

• Fields: the standard fields your questions map into.
• Routing: the routing this form's leads run through.
• Presets: sending different leads to different destinations.
• Destinations: who receives the lead, and what counts as a yes.