Step by step

Step by step shows a shopper one question at a time. They answer it, press Continue, and the next one arrives.

Above the question is a rail. It names each step, marks the ones they have done, and shows how many are left.

Use it on a product with a lot to ask. A long form that scares people off becomes four short screens they can finish.

This is a Pro arrangement. It changes how the page is laid out. What you ask, what it costs and what reaches the order all stay the same.

Turning it on

Groups decide the steps. Questions in the same group share a step, and a question outside any group is a step of its own, so group related questions first.

1. Open the product and find the Product Options panel.
2. Gather related questions into groups. Give each group a name, because that name becomes the step’s heading.
3. At the top of the panel, open How this page looks.
4. Under Arrangement, choose Step by step.
5. Update the product.

Now open the product page as a shopper would. You should see the first group’s questions on their own, with a rail above them and a Continue button below.

A step is a section, not a question

This is the part worth reading twice. Three groups of four questions make three steps, not twelve.

So the rail does not grow as you add questions. Twelve questions across three groups still show three stops.

If you want more steps, make more groups. If the rail is too long, merge some.

What the shopper sees

The rail runs above the question. Each stop carries the step’s name, or just a number on a narrow screen.

Continue checks the step, then moves on. If something there is still unanswered, the rail marks that step and the price bar names what is missing. Nothing stops the shopper looking ahead; Add to cart is what will not take an unfinished order.

Back returns to the previous step. Every answer is kept.

The rail works in both directions. A shopper can look ahead, jump to a step they have already passed, and come back. Nothing is lost by exploring.

A step they left with something owing is marked in the rail. They find out there, not at the Add to cart button.

Why the rail marks it early

A shopper who fills in a long form and only then learns something is missing usually gives up. Marking the step in the rail tells them while they are still in the flow. The mark says which step, not just that something is wrong.

Check your answers

Turn on Show a review before the button and Step by step adds a final step called Check your answers.

It lists every question and what the shopper chose. Each row has a Change link that takes them back to that one question.

The review counts as a stop on the rail. A product with three groups and a review shows four stops.

See how the page looks for that switch and the two beside it.

With conditional options

Step by step and conditional options work together. A rule decides whether a question applies, then the arrangement decides which step it lands on.

A step whose every question waits on a rule stays on the rail, greyed and without a number. Continue and Back pass it, so the shopper is never walked into an empty screen. Pressing it says what it is waiting for, for example “Available when Personalisation is Add print or embroidery”.

So the rail keeps the same stops whatever the shopper answers. The count above it counts only the steps they will go through: “Step 1 of 2” can become “Step 2 of 4” once an answer opens the greyed ones.

What you should see

• The rail above the question, naming the current step.
• One group’s questions on the screen, and no others.
• A step left with a required question unanswered marked in the rail.
• Steps that wait on an earlier answer greyed in the rail, never opened empty.
• The running price updating as the shopper answers, the same as on any other arrangement.
• Check your answers as the last step, if you turned the review on.

If Pro lapses

The product keeps the choice. The page falls back to One after another: every group, every question and every price, laid out in full on one screen.

It is a longer page, but a complete and correct one. Shoppers can still buy. Restore the plan and the steps come back without you setting anything again.