7.2. Mount points for dynamic plugin integration
You can customize the application header in Developer Hub using mount points for dynamic plugins. These mount points give flexibility in configuring the position of the header, its components and dropdown menus. You can create a customized experience with the following enhancements:
- application/header
-
Controls the header position. Use
config.positionto set placement as eitherabove-main-contentorabove-sidebar. - global.header/component
Configures header components. Use
config.priorityto set the order of components, and pass properties (including CSS styles) viaconfig.props.Self-service button
- mountPoint: global.header/component importName: HeaderIconButton config: priority: 80 props: title: Self-service icon: add to: createSpacer element
- mountPoint: global.header/component importName: Spacer config: priority: 99 props: growFactor: 0Divider element
mountPoints: - mountPoint: global.header/component importName: Divider config: priority: 150
- global.header/profile
Configures the profile dropdown list when the
ProfileDropdowncomponent is enabled.Adding a settings link to the profile dropdown
- mountPoint: global.header/profile importName: MenuItemLink config: priority: 100 props: title: Settings link: /settings icon: manageAccounts
- global.header/create
Configures the create dropdown list when the
CreateDropdowncomponent is enabled.Adding a section for registering a component
- mountPoint: global.header/create importName: RegisterAComponentSection config: props: growFactor: 0