---
category: [Administration & Integrations, Platform and Product Extensions, Platform and Product Extensions/Integration, Administration & Integrations/Custom Integrations & Apps, Platform and Product Extensions/Workday Extend]
keyword: [Extend, Presentation Components, widgets, tags, UI components]
nav: wcp_docs
parent_url: /wcp_docs/
title: multiStepLayout
layout: subsection
wd_wcptag: multiStepLayout
---
A structured layout that groups widgets into wizard-like steps that occupy the entire body of the page. The `multiStepLayout` widget contains a list of steps, displaying step numbers at the top of the page that indicate the user’s progress while navigating across the sections of the page.
You can only use `multiStepLayout` as the top-level tag within the `body` tag. Use `multiStepLayout` on view and edit pages.
Considerations:
- In the `steps[]` array, specify at least 1 step. Maximum is 10 steps.
- Each step is a `layoutSection` tag, which contains either `section` or `fieldSet` tags.
Avoid nesting deep levels of section and fieldSet tags within a layoutSection.
- You can’t use `multiStepLayout` in a `pod`.
## Example
In this example, a sample edit page contains a `multiStepLayout` with these 3 steps:
The sample PMD page:
```
{
"id": "multiStepPage",
"endPoints": [ ],
"presentation": {
"pageType": "edit",
"title": {
"type": "title",
"label": "Onboarding Profile"
},
"body": {
"type": "multiStepLayout",
"id": "multiStepLayoutId",
"steps": [
{
"type": "layoutSection",
"id": "layoutSectionId1",
"children": [
{
"type": "fieldSet",
"id": "leftSection1",
"title": "Worker",
"horizontal": false,
"children": [
{
"type": "text",
"id": "leftName",
"label": "Name",
"value": "<% 'John Doe' %>"
},
{
"type": "date",
"id": "leftDate",
"dateDisplayPattern": "MM-dd-yyyy",
"label": "Hire Date",
"value": "<% '2026-04-20' %>"
},
{
"type": "number",
"id": "leftNumber",
"label": "Job Level",
"fractionDigits": 0,
"value": "3"
}
]
}
]
},
{
"type": "layoutSection",
"id": "layoutSectionId2",
"children": [
{
"type": "section",
"id": "sectionID3",
"horizontal": false,
"label": "Equipment and Access",
"children": [
{
"type": "instanceList",
"id": "equipmentType",
"label": "Equipment Type",
"instanceList": [
{
"id": "scQ1",
"descriptor": "Laptop"
},
{
"id": "scQ2",
"descriptor": "Desktop"
},
{
"id": "scQ3",
"descriptor": "Phone"
},
{
"id": "scQ4",
"descriptor": "Peripheral"
}
]
},
{
"type": "grid",
"label": "Assets",
"id": "myGrid",
"rows": "<% [] %>",
"rowVariableName": "thisRow",
"columns": [
{
"type": "column",
"columnId": "col1",
"label": "Asset Tag",
"cellTemplate": {
"type": "text",
"id": "assetTag"
}
},
{
"type": "column",
"columnId": "col2",
"label": "Serial Number",
"cellTemplate": {
"type": "text",
"id": "serialNumber",
"value": "<% 'XYAI1235' %>"
}
},
{
"type": "column",
"columnId": "col4",
"label": "Issue Date",
"cellTemplate": {
"type": "date",
"id": "issueDate",
"dateDisplayPattern": "MM-dd-yyyy",
"value": "<% '2026-04-20' %>"
}
}
]
}
]
}
]
},
{
"type": "layoutSection",
"id": "layoutSectionId3",
"children": [
{
"type": "fieldSet",
"id": "rightSection",
"title": "Expense",
"horizontal": false,
"children": [
{
"type": "dropdown",
"id": "rightCurrency",
"label": "Currency",
"selectedValues": "<% ['USD'] %>",
"instanceList": [
{
"id": "USD",
"descriptor": "USD"
},
{
"id": "GBP",
"descriptor": "GBP"
},
{
"id": "JPY",
"descriptor": "JPY"
}
]
},
{
"type": "text",
"label": "Cost Center ID",
"id": "textId1",
"value": "<% 'A5002001' %>"
},
{
"type": "number",
"label": "Monthly Expense Budget",
"id": "budgetAmount",
"value": 500.00
},
{
"type": "checkBox",
"label": "Corporate Card Issued",
"value": false
}
]
}
]
}
]
},
"footer": {
"type": "footer",
"children": [
{
"type": "richText",
"enabled": "false",
"value": "Powered By Workday Extend"
}
]
}
}
}
```
## Mobile Support
Android, iOS
## Attributes
- id
Data type: binding-String
Unique identifier used to reference this widget from other tags.
Notes:
- The `id` must start with a letter.
- The `id` must be unique per page.
- To enable other widgets to reference this widget `id`, place this widget before the other widgets on the PMD. The PMD validation returns an "Undefined variable" error if it doesn't find a previously defined `id` in the PMD.
- Workday recommends that you include the `id` in your tag definitions for debugging purposes.
- steps
Data type: list of `layoutSection` tags
(Required) An array of `layoutSection` tags, each with a container of tags that display as a step. You can specify a maximum of 10 `layoutSection` tags.
- layoutSection
Data type: `layoutSection` object
Displays a container of tags in a section step.
- children
Data type: list of `section` or `fieldSet` tags
An array containing either `section` or `fieldSet` tags whose widgets display within the `layoutSection` step. Avoid deep nesting of `section` and `fieldSet` tags.
- render
Data type: booleanScript
Indicates whether or not this `layoutSection` tag turns into a widget. If true, this tag renders as a widget on the page. If false, the page doesn't add this section or its children. The default is true.
Unlike the `visible` attribute, if `render` is false, other tags on the page can't reference this tag or widget on edit pages. On view pages, a tag cannot reference other tags, regardless of the `render` attribute value.
- render
Data type: booleanScript
Indicates whether or not this `columnLayout` tag turns into a widget. If true, this tag renders as a widget on the page. If false, the page doesn't add this section or its children. The default is true.
Unlike the `visible` attribute, if `render` is false, other tags on the page can't reference this tag or widget on edit pages. On view pages, a tag cannot reference other tags, regardless of the `render` attribute value.