A single long checkout form can feel overwhelming, especially on mobile – splitting it into steps (shipping, then payment, then review) reduces how much a shopper sees at once.
The Woo Multi Step widget turns WooCommerce Checkout into a step-by-step wizard, with 5 built-in visual styles for the step indicator.
For the full settings tour of every Woo Builder widget, see Woo Builder Settings Overview.
Requirement – This widget is a part of The Plus Addons for Elementor Pro, make sure it’s installed & activated to enjoy all its powers.
Before You Start
- Prerequisite: Elementor (free) installed and active.
- Prerequisite: WooCommerce installed and active, with at least one published product.
- Edition: all Woo Builder widgets are part of The Plus Addons for Elementor Pro – a Pro licence is required.
- Widget to enable: go to The Plus Addons > Widgets, search for Woo Multi Step and turn its toggle on.
Steps
- Add the Woo Multi Step widget to your Checkout page template (in place of, or alongside, Woo Checkout).
- From Style, choose one of 5 visual styles for the step indicator – Style 1 (the default) through Style 5.
Style 5’s Extra Layout Option
Only when Style is set to Style 5, a Layout dropdown appears, choosing Horizontal (the default) or Vertical arrangement of the steps – the other 4 styles do not expose this choice.
Settings Overview
| Setting | What it does | Default |
|---|---|---|
| Style | Visual style of the multi-step indicator (5 options). | Style 1 |
| Layout | Horizontal or Vertical steps – Style 5 only. | Horizontal |
