The Multi-Step Form Block: One Long Form, Broken Into Short Steps

Split a long intake or booking form into short steps with a progress indicator, per-step validation and a review screen — built from the field blocks you already use.

A long form asks for everything at once

You’re building an intake form on a client site: contact details, what the project is, roughly when, and a note at the end. It all has to be there, so it all goes on one page, and the page becomes a wall of inputs. Then the client wants a question added between two old ones, and you’re back in the template.

The Multi-Step Form block splits that same form into short steps you build and reorder in the editor. Each step is a Form Step block holding the fields that belong together, and the visitor sees one at a time.

Progress bar, three steps, a review screen before it sends. Next only moves on once the step is filled in, and the review lists every answer with an Edit link back.

Step 1 of 4

Your details

So we know who we’re talking to.

The project

A rough idea is plenty at this stage.

Anything else

Optional — but it helps.

What you can set up

Build it step by step → each Form Step holds one group of fields with its own title, so reordering the form is dragging a block.
Choose how progress is shown → a bar, numbered dots with labels and a counter, or nothing — and visitors can click a finished step to jump back.
Check each step before moving on → required fields and phone numbers are checked on Next, the page scrolls to the problem, and the step shakes.
Add a review step → the final screen groups the answers by the step they came from, each with an Edit link straight back to it.
Decide what happens after Submit → keep the entry, mail it on, send an auto-reply, then show a thank-you screen or a page of your choosing.
Bots are handled before you are → a hidden trap field and an hourly limit are on from the start, and a CAPTCHA can go on the last step.
Plus the usual spacing, colour and responsive controls, so it fits your design instead of fighting it.

Finished, not just featureful

A form touches accessibility, motion, colour and the data it leaves behind all at once — the parts that quietly get skipped when one is hand-built. Here they come settled.

It works without a mouse → progress is reported, each step change is announced, and the steps that aren’t on screen are switched off for keyboard and screen readers.
The motion is optional → anyone whose device asks for reduced motion gets the step change without the slide, fade, shake or bounce.
Every colour comes in a pair → progress, headings, inputs, errors and the thank-you screen each carry a light value and a dark one.
Nothing identifying is kept → an entry holds the answers and nothing else: no IP address, no browser string, no referring page.
Entries needn’t be kept forever → name a number of days and older ones clear out on a schedule, and export-or-erase requests reach them like any other personal data.

The same block, set up a different way

Numbered dots you can click, no review screen, answers kept if you wander off. A short quote request, meant to be done in two screens.

What are we quoting?

One line is enough.

Where do we send it?

Last screen, promise.

Building one takes about as long as writing the questions down. Drop the block in, add a step for each part, put the fields inside, and title each step. The sidebar handles progress, button labels, the review screen and where the entry goes.

It lives in the same editor as the blocks you already use, shares the same spacing, colour and responsive controls, and fills its steps with the Flexa Block field blocks — so it needs Flexa Block switched on alongside it.

Ready to break that form into steps?

Multi-Step Form is part of Flexa Block Pro. Build the steps in the editor, keep the entries on your own site, and hand the page over without leaving a support ticket behind.

More articles

Keep reading

Other guides from the Flexa Blocks library.

48 posts found