---
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: hub
layout: subsection
wd_wcptag: hub
---
A container widget that displays a navigation pane on the left and task pages on the right. The `hub` widget enables you to create a centralized area with navigation links to contextual tasks and related information.
Use `hub` only on view pages. The navigation tasks must also be view pages. The `hub` widget currently doesn't support edit pages.
Jump to:
- [Attributes](/wcp_docs/qum1635896773979.html#section-attributes)
## Usage
The `hub` tag is the only tag in the presentation `body` of a view page. To construct a hub, specify these main attributes:
- `label` - The hub title, which displays at the top of the left navigation pane.
- `icon` - The icon next to the hub title.
- `initialTask` - The default landing page. This page displays on the right pane when the hub loads.
Note: The `initialTask` doesn't display a link on the left navigation pane. If you want to include a link to the `initialTask` on the left navigation pane, add an `item` in `navigationTasks[]` that specifies the same task.
- `navigationTasks[]` - The list of links on the left navigation pane. Specify a combination of:
- `item` tags.
- `group` tags containing `items[]`.
Each item, whether an individual item or in a group, is a link that displays a task page on the right pane. You can optionally specify an icon for each item, but not for items in a group.
- `additionalLinks` - An optional section at the bottom of the left navigation pane that contains links to either external sites or other tasks that open outside the hub.
Consider these guidelines:
- Ensure that you've defined all task pages in the AMD.
- Ensure that the `queryParams` variables you use in the task pages match the parameters you send from the `hub`.
- You can use a task page only within 1 hub. You can't use the same `taskId` across multiple `hub` or `listDetailHub` widgets in multiple PMDs.
- `navigationTasks[]` can have a maximum number of 20 items.
- `items[]` in a group can have a maximum of 5 items.
- `additionalLinks` can have a maximum of 20 links.
- Workday doesn't support embedding the `hub` widget within a profile group and dashboard.
## Example
This sample `hub` displays related pages about the current worker. The Job Title and Contact Information labels on the navigation pane are `item` tags.
The Worker Details label on the navigation pane is a `group` tag. When expanded, it displays the Skills item.
The sample PMD with the `hub` tag:
```
{
"id": "hubStatic",
"presentation": {
"body": {
"type": "hub",
"label": "<% currentWorker.descriptor + ' Hub' %>",
"icon": "wd-accent-award-medal",
"initialTask": {
"taskId": "hubTaskOne",
"parameters": {
"pageTitle": "Job Title",
"label1": "Business Title",
"field1": "<% currentWorker.primaryJob.businessTitle %>",
"label2": "Organization",
"field2": "<% currentWorker.primaryJob.supervisoryOrganization.descriptor %>"
}
},
"navigationTasks": [
{
"type": "item",
"task": {
"taskId": "hubTaskOne",
"parameters": {
"pageTitle": "Job Title",
"label1": "Business Title",
"field1": "<% currentWorker.primaryJob.businessTitle %>",
"label2": "Organization",
"field2": "<% currentWorker.primaryJob.supervisoryOrganization.descriptor %>"
}
},
"label": "Job Title"
},
{
"type": "item",
"task": {
"taskId": "hubTaskOne",
"parameters": {
"pageTitle": "Contact Information",
"label1": "Email",
"field1": "<% currentWorker.person.email %>",
"label2": "Phone",
"field2": "<% currentWorker.person.phone %>"
}
},
"icon": "wd-icon-mail",
"label": "Contact Information"
},
{
"type": "group",
"label": "Worker Details",
"icon": "wd-icon-folder-close",
"items": [
{
"type": "item",
"task": {
"taskId": "hubTaskTwo",
"parameters": {
"pageTitle": "Skills",
"workerId": "<% currentWorker.id %>"
}
},
"label": "Skills"
}
]
}
],
"additionalLinks": {
"title": "Suggested Links",
"links": [
{
"type": "external",
"label": "<% 'Workday' %>",
"url": "<% 'https://www.workday.com' %>"
},
{
"type": "task",
"label": "Team Members",
"task": {
"taskId": "teamMembers"
}
}
]
}
}
},
"endPoints": [
{
"baseUrlType": "workday-staffing",
"name": "currentWorker",
"authType": "sso",
"url": "/workers/me"
}
]
}
```
Notes about the sample hub:
- The `initialTask` uses the hubTaskOne task page, which displays the Job Title landing page.
The sample hubTaskOne.pmd:
```
{
"id": "hubTaskOne",
"presentation": {
"title": {
"type": "title",
"label": "<% queryParams.pageTitle %>"
},
"body": {
"type": "section",
"horizontal": false,
"children": [
{
"type": "text",
"id": "text1",
"label": "<% queryParams.label1 %>",
"value": "<% queryParams.field1 %>"
},
{
"type": "text",
"id": "text2",
"label": "<% queryParams.label2 %>",
"value": "<% queryParams.field2 %>"
}
]
}
}
}
```
- The `navigationTasks[]` includes a link that also displays the Job Title page. This sample enables the user to navigate back to the landing page of the hub.
- The Job Title and Contact Information links send different parameters to the same task page, hubTaskOne.
- The Skills link displays the hubTaskTwo task page. The sample task page uses the passed queryParams.workerId to retrieve the skills and display them in a grid.
## Mobile Support
Android, iOS
## Attributes
- initialTask
Data type: object
(Required) The landing page of the hub.
Contains these attributes:
- taskId
Data type: string
(Required) The `taskId` that corresponds to a page to display on the right pane. Ensure that you've defined the `taskId` in the AMD.
- parameters
Data type: Map
A map containing task parameters sent to the specified `taskId` page. Note that the parameter value supports PMD Scripting. The page can reference these parameters using the `queryParams` variable.
- navigationTasks
Data type: list of item and group objects
(Required) The list of navigation tasks that display as links on the left navigation pane.
`navigationTasks[]` can contain a combination of `item` and `group` objects. The maximum number of items in `navigationTasks[]` is 20.
- item
Data type: object
Represents a navigation link, each with an icon and label. An `item` contains these attributes:
- label
Data type: stringScript
(Required) The link text.
- task
Data type: object
(Required) The task for the navigation link.
Contains these attributes:
- taskId
Data type: string
(Required) The `taskId` that corresponds to a page to display on the right pane. Ensure that you've defined the `taskId` in the AMD.
- parameters
Data type: Map
A map containing task parameters sent to the specified `taskId` page. Note that the parameter value supports PMD Scripting. The page can reference these parameters using the `queryParams` variable.
- icon
Data type: string
The name of the icon that displays on the left of the link. If you don't specify an icon, the item uses a default icon. For valid values, see the icons prefixed with `wd-icon` in Navigation Link Icons in [Reference: Icons](/wcp_docs/pyw1636491346913.html).
- render
Data type: booleanScript
If true, this item renders as a link on the hub navigation. If false, the hub navigation doesn't add this link. The default is true.
- group
Represents a group of up to 5 links, which can have a group-level icon and label. The `group` tag contains these attributes:
- items
Data type: list of item objects
(Required) `items[]` contains up to 5 `item` objects. The items in a group don't use icons.
An `item` contains these attributes:
- label
Data type: stringScript
(Required) The link text.
- task
Data type: object
(Required) The task for the navigation link.
Contains these attributes:
- taskId
Data type: string
(Required) The `taskId` that corresponds to a page to display on the right pane. Ensure that you've defined the `taskId` in the AMD.
- parameters
Data type: Map
A map containing task parameters sent to the specified `taskId` page. Note that the parameter value supports PMD Scripting. The page can reference these parameters using the `queryParams` variable.
- render
Data type: booleanScript
If true, this item renders as a link on the hub navigation. If false, the hub navigation doesn't add this link. The default is true.
- label
Data type: stringScript
(Required) The group label. The group label has a drop-down arrow that expands or collapses the group of links.
- icon
Data type: string
The name of the icon that displays on the left of the link. If you don't specify an icon, the group uses a default icon. For valid values, see the icons prefixed with `wd-icon` in Navigation Link Icons in [Reference: Icons](/wcp_docs/pyw1636491346913.html).
- render
Data type: booleanScript
If true, this item renders as a link on the hub navigation. If false, the hub navigation doesn't add this link. The default is true.
- additionalLinks
Data type: AdditionalHubLink map
Contains additional navigation links at the bottom of the navigation pane. A line displays at the top of the additional links section. The maximum number of links in `additionalLinks` is 20.
An AdditionalHubLink map contains these attributes:
- title
Data type: stringScript
The title of the additional links section.
- links
Data type: AdditionalHubNavigationLink array
The list of additional links. A link can either be an `external` or `task` tag:
- `external` - The link opens an external URL outside the hub. Specify the required `label` and `url` attributes. Example:
```
{
"type": "external",
"label": "<% 'Go to Workday' %>",
"url": "<% 'https://www.workday.com' %>"
}
```
- `task` - The link opens a task page outside the hub. Specify the required `label` and `task` attributes. Example:
```
{
"type": "task",
"label": "<% 'Go to External Task' %>",
"task": {
"taskId": "anotherTask",
"parameters": {
"workerId": "<% currentWorker.id %>"
}
}
}
```
- icon
Data type: string
The name of the icon that displays at the top of the left navigation pane. For valid values, see the icons prefixed with `wd-accent` in Hub Title Icons in [Reference: Icons](/wcp_docs/pyw1636491346913.html).
The default icon is a task clipboard icon.
- label
Data type: stringScript
The text that displays at the top of the left navigation pane.