# Multi-step and chained component experiences

**Summary:** Build multi-step flows in one component or chain several components together. For onboarding, walkthroughs, and longer guided journeys.

**In short:** Multiple steps in a single component, or several components chained one after the other. For onboarding, walkthroughs, and longer journeys.

**Last updated:** 2026-05-27

## Key concepts

### Multi-step component
Single component with a built-in stepper. Two to four steps recommended. Each step has its own content (image, header, body, buttons). Common use: in-product onboarding for a new feature.

### Chained components
Several independent components linked one after the other. Each is its own component, on its own page or surface. Common use: marketing-site qualification flow that hands off to a sign-up form.

### Step IDs and linking
Each component has an ID. Chain components by setting the primary button URL to the next component's ID. Same-page jumps use `#[id]`. Cross-page jumps use the path plus the ID.

### Final step actions
The last step of a multi-step component can close, redirect, run a Procedure, or capture an email.

## What you can do here

- Build a multi-step component
- Chain multiple components into a sequence
- Capture email or other variables at the final step
- Trigger Procedures at any step
- Combine chained flows with Audiences for targeted journeys

## When to use it

- You are building a multi-step onboarding flow
- You have a journey that spans multiple pages
- You want a quick qualification flow that hands off to a deeper experience
- You need to onboard a new user with a guided product tour

## When not to use it

- A single step would do. Resist the temptation to make every flow multi-step.
- The flow is sequential by nature, but the customer often skips ahead. Use chained components instead, where each step is its own page.

## How it works

A multi-step component uses an internal stepper. The customer moves through with primary and secondary buttons. Chained components are simpler: each component primary button URL points at the next component's ID, and the platform handles the navigation.

## Frequently asked questions

**How do I build a multi-step component?**
Open \

**How do I add steps to an existing multi-step component?**
Open the component editor and find the Stepper tab. Click the plus icon to add a step. Keep total steps to three or four for best results.

**How do I chain two components together?**
On the first component, set the primary button URL to `#[id]` of the second component (same page) or `/path/#[id]` (different page). The second component appears when the customer clicks.

**Where do I find a component ID?**
The ID appears in the URL when previewing the component or on the settings page.

**Can I capture an email at the end of a multi-step component?**
Yes. The last step has an email field option. Map it to your CRM or trigger a follow-up Procedure.

**Can chained components span different surfaces?**
Yes. The first component can live on your marketing site and the next on the product, as long as the Unless snippet is installed on both.