Skip to main content

Custom Header

Transform your SharePoint site’s navigation experience and showcase your brand identity.

Sprocket Header

Configuration

FieldDescription
Show HeaderClick to enable and display Sprocket header on your site. Note: Enabling Sprocket Header provides you the following additional options.
Header LogoClick Select Logo and select a logo to display on your Sprocket header.
Show Site TitleClick to enable and display title on your site.
Hide Hub Site TitleClick to hide hub site title on your site.
Minimise On ScrollClick to switch between a standard and a compact Sprocket header as you scroll down the page. If you prefer to always have the standard header visible, you can simply disable this feature.
LayoutClick to select from the following layout options: Standard - Default option with standard size, Compact - Reduced header height, Custom - enables you to manually set the header height.
Custom Header HeightEnter a custom size for the header if you have selected the Custom layout option.
Font ColourClick to pick a colour for of the font, from the colour picker. Click Reset to default icon to revert to the default colour.
Icon ColourClick to pick a colour for of the font, from the colour picker. Click Reset to default icon to revert to the default colour.
Background ColourClick to pick a colour for of the font, from the colour picker. Click Reset to default icon to revert to the default colour.
Background ImageClick Select Background Image and select an image to display on the header background.
Show NavigationClick to enable navigation option on the Sprocket header. Available options are: Hub, Site, Term Store
Navigation Data SourceSelect the source from which you want to pick the navigation data.
Term SetClick the drop-down list to select a Term Set. Optionally, you can click Manage Term Store to manage the organizational terminologies.
Global Navigation SourceProvide a relative URL to site which you want to pick the navigation data.
Menu StyleClick to select from the following menu styles: Cascading - displays a traditional dropdown menu with a vertical hierarchy, Mega Menu - displays a larger dropdown menu with multiple columns of content.
Navigation Font ColourChoose a custom font color for your Mega Menu's navigation. Use the color picker tool to select your preferred color or enter a specific color code. This option enables you to personalize your Mega Menu's font color.
Navigation Background ColorChoose a custom background color for your Mega Menu's navigation. Use the color picker tool to select your preferred color or enter a specific color code. This option allows you to personalize your Mega Menu's background color.
Navigation Hover Effect ColorChoose a custom color for the hover effect on your Mega Menu's navigation. Use the color picker tool to select your preferred color or enter a specific color code. This option enables you to personalize the hover effect color on your Mega Menu's navigation.
Navigation Hover Text ColorChoose a custom font color for the text in the hover state of your Mega Menu's navigation. Use the color picker tool to select your preferred color or enter a specific color code. This option allows you to personalize the font color of the text in the hover state of your Mega Menu's navigation.
Show Hub NavigationClick to enable hub navigation display when the data source is Site. This option is available only when you select Site or Term Store as the Navigation Data Source.
Show FollowingClick to enable display of the number of site followers.
Show ShareClick to enable display of the number of site shares.