The Global Header, also known as the HPE Common Header and Footer Web Service, provides a tunable, yet consistent header and footer to be used across all HPE applications. The header is provided as a service and injected into your application at run-time.
The Global Header is a standardized header to be used across applications. HPE provides an implementation to be referenced from your application. Both the header and footer are customizable, allowing consumers to choose various features to enable such as country selector, shopping cart, HPE passport login, privacy statement links, theme mode, and more.
Each site or application will have different needs. Some header options may not make sense for some sites. The following sections will help you decide which options to include.
What makes up the Global Header?
The full global header with all options enabled looks like this:
To configure what parts are shown in the global header for your site, go to the
HPE Common HFWS test page.
There you can choose various options and hit
Submit. The global header at the top
of that page will change to include those options, and the code sample on that page will
change to declare the chosen options as parameters in
<script src="https://h50007.www5.hpe.com/hfws/us/en/hpe/latest.r/root?..."> element that
configures the header.
You can then copy the URL from that
<script> and use it in the code sample at the top of
this page to configure the global header and footer for your site.
Let's take a closer look at each part of the global header and footer.
Most sites should choose the default which will be the HPE logo for regular mode or the GreenLake logo for
console mode. You can force it to use one or the other by specifically choosing HPE versus GreenLake if
The main navigation in the center of the header provide marketing content. The links allow users to find HPE products, contact support and get more information about HPE. These should also typically be enabled for most sites.
Sign in allows the user to sign in to their HPE Passport account for hpe.com. Enable this option if your site uses features that require a Passport login.
Color Scheme allows implementors to choose either a light or dark variant of the header/footer.
The color scheme you choose should be harmonious with the primary background of your application's
header and avoid stark contrast which interrupts a user's visual flow. If your application supports
light and dark modes, consider setting the
color_scheme parameter with a value of either
dark in alignment with the user's preference.
The global footer contains links for privacy information and various opt-out and choices required by European GDPR standards as well US and other privacy requirements. In general these links should be enabled for customer-facing sites.
The Privacy link goes to HPE's Privacy Statement which explains how HPE manages and protects a users information and respects the relevant privacy standards like GDPR, APEC, etc.
The Ad Choices and Cookies link goes to the section of the Privacy Statement that explains how cookies are used as well as how you can opt-out of targetted advertisements and analytics data such as Google Analytics and Adobe Analytics.
The Do Not Sell My Personal Information link goes to information on how to opt-out of any sale of personal collected by automatic data collection tools.
Something missing or looking for more information? Get in touch to help make the HPE Design System better.