2859791 - SAP Fiori Standards Applied to Page Header in SuccessFactors

• The global page header has been updated to be consistent with the latest SAP Fiori design standards.
• The Fiori shellbar will be enhancement to ensure harmonization across the suite.
• Changes have been made to the page header so it is now consistent with Fiori Design.

Image/data in this KBA is from SAP internal systems, sample data, or demo systems. Any resemblance to real data is purely coincidental.

SAP SuccessFactors HXM Suite

We've updated the global page header to make it more consistent with the latest SAP Fiori design standards. Some changes are new. Other changes were previously optional, but we've made them universal.

Differences H2 2020 Release :

Note: We removed the optional setting Disable SAP Fiori 3 Header from the Company System and Logo Settings page and from the Provisioning tool. Changes that were previously disabled by this setting (introduced in 2H 2020) are now universal.

The changes are numbered and illustrated on the Diagram under the Image of How the Header Look Now.

1. As part of the new shell bar the header of BizX pages will have width, height, padding, margin and font-size changes. The height of the page header shortened slightly (by 9 pixels) so you may want to adjust the size of the header background image in your custom themes accordingly
2. Alert icons of Notifications and To-do button part of the header will require to have one constant foreground and background colors.
3. Action search field will now adhere to header area theme to be consistent with rest of header elements.
4. A change in background color for tabs on some pages. You may want to adjust the text color of tab titles based on the new background color see more details available sap help how to change these settings Theme Settings: Global Navigation
5. Centered logos are now left-aligned. In accordance with SAP Fiori guidelines, we're phasing out the option to center logos in the header. Please use a left aligned logo instead.​ More details on Configuring the Logo in a Custom Theme
6. The (Go to Home) icon is removed. Click the logo instead to return to the home page. ​
7. Users name is no longer displayed in the top right beside users imagine. To see the user’s name, hover or click on the image.
8. The label "Options" under the utility user menu has been renamed to "Settings" to make it consistent across the SAP applications.

How the Header Looks Now:

How the Header Looked Before: 

Differences H2 2021 Release :

Changes to page header introduced in 2H 2021 has been temporatily disabled as outlined below this is for both Preview and Production, this change was based on customer feedback including issues related to the use of SAP EnableNow.

SAP Product team have changed the default view of the header / shell bar to the version that was delivered in the 1H 2020 release as outlined above - see SAP Community for further details here.

SAP Product Team will release the latest version of the shell bar as outlined below once all issues have been addressed.

1. End of support for right-aligned logos (following pattern used for center-aligned logos in H2 2021 ). It is no longer possible to move the logo to the Right/Center options in Theme Manager wont work and will be removed in a future release.
2. Minor visual design changes to search results, such as photo size and text size. 
3. The order and placement of icons in the page header are adjusted to follow SAP Fiori standards. All icons, including (Show Me), are now on the same side of the avatar photo.
4. Right click menu items from header to open in new tab is no longer available reference KBA for more details 3105442 - H2 2021 - Right Click Open New Tab functionality for menu items no longer possible.
5. You can no longer switch between different types of search, in systems that are integrated with SAP Jam. Instead, search results are now combined and include both the SAP SuccessFactors search for people and actions and the SAP Jam search.

How the Header Looks Now:

How the Header Looked Before:

Important Note : 

New changes in 2H 2021 aren’t applied to the page header in Internet Explorer 11. Deprecation of Support for Internet Explorer 11

Earlier changes introduced in 2H 2020 are applied to all browsers.

Differences H2 2022 Release:

As part of the latest release SAP Product team will  be including below changes so that the SAP SuccessFactors global page header is consistent with SAP Fiori design standards.

1. We can use the (Search) icon to show or hide the search field. The search field is shown by default, but can be hidden.
2. When no employee photo is available or you don't have permission to view it, the avatar image now displays the person's initials (for Latin alphabets) or a gender-neutral icon  (for other non-Latin characters). The standard gender-neutral icon replaces the SAP SuccessFactors gender-neutral placeholder image.
3. Right-aligned logos are no longer supported. All logos are now left-aligned.
4. Its not possible to switch between different types of search, in systems that are integrated with SAP Jam. Search results are combined, including both the SAP Jam search and the SAP SuccessFactors search for people and actions.
5. The order and placement of icons in the page header are adjusted to follow SAP Fiori standards. The  (Show Me) icon is now on the same side of the avatar image as all other icons.
6. Minor visual design changes to several UI elements, including the main navigation menu, people and action search results, the Proxy Now dialog, and the Show Me dialog. Changes include avatar image size, text size, spacing, and padding.
7. Page header is more responsive, for display on smaller displays.

How the Header Looks Now:

How the Header Looked Before:

• KB article 2232774 - Home icon does not appear in the Global Header next to Home menu Drop Down
• SAP Fiori Standards Applied to Page Header
• 3110679 - H2 2021 – Logo appearing Cut off
• 3110102 - SAP Header To-Do badge text matching the color from module picker - H2 2021
• 3110578 - When hover over the avatar icon it is showing a text saying "Profile"

sf, success factors, WEF-22820, 2H 2022, UI-21372, b2011, 2H 2020, Second half, Fiori, fiori header, UI, release , SAP Fiori Standards Applied to Page Header , Disable SAP Fiori 3 header , theme , theme  manager , WEF-3035,  Header, Account Navigation, home icon , Logo , Name , text not showing , theme , KBA , LOD-SF-PLT-THM , Theme Manager Issues , Product Enhancement