Skip to Content
Product Information

SAP Fiori Standards Applied to Page Header

With SAP SuccessFactors 2H 2020 Release we’ve updated the global page header so that it’s consistent with the latest SAP Fiori design standards and to ensure harmonization across the suite. The SAP Fiori 3 header is now opt-out, rather than opt-in, and is enabled by default: WEF-3035 – SAP Fiori Standards Applied to Page Header

This blog post, written by the SAP SuccessFactors Platform Support team which i am a member, is aimed to provide awareness of the visual changes to the page header  effective post 2H 2020 Release. This enhancement primarily impacts customers who use custom themes, particularly themes with a center-aligned logo.

Key Dates of Replacement: 

Before considering opting out, note that we’re retiring the legacy page header. Planned retirement date is 1H 2021 when all customer instances are upgraded to the SAP Fiori 3 header and the legacy header is retired. Further details on Key Dates for Replacement available here

How to Opt Out:

To opt out administrators have an option to disable the feature from Admin Center > Company System & Logo settings page > Disable SAP Fiori 3 Header

 Differences to Note: 

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- or right-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:

Additional Resources:

 

I hope this blog post has clearly highlighted visual changes which can be expected as part of the Fiori 3 Header and also has raised awareness of the retirement date for the legacy header. You should now have all the information to be prepared for upcoming changes. If you have questions or feedback regarding my blog post, please feel free to leave a comment.

For those looking for further content on the release please review the following information:

Other Release specific recommended information:

Be the first to leave a comment
You must be Logged on to comment or reply to a post.