Skip to end of metadata
Go to start of metadata

Purpose

This page will discuss the usage and limitations of style sheets in Web Dynpro ABAP.

Overview

The usage of style sheets

For Web Dynpro ABAP there are three ways for usage of style sheets:

1. SAP standard standalone style sheets, without portal integration. Please use parameter WDTHEMEROOT for selecting the correct parameter.

2. Stylesheets with portal integration. In this case, please ensure that the portal stylesheet version is equal or higher than the ABAP stylesheet. (See SAP Note 1446099).

3. Customer stylesheets, please use UI Theme Designer for creating custom themes.

Web Dynpro ABAP - Theming support matrix


ThemesSAP_BASIS
701
SAP_BASIS
702
SAP_BASIS
731
SAP_UI
740
SAP_UI
750
SAP_UI
751
SAP_UI
752
SAP_UI
753
SAP_UI
754
SAP_UI
755 

Is this release supported?

 YES YES YES

NO

Note 2583882

NO

Note 2972680

NO

Note 2864280

NO

Note 2972656

 YES YES YES
SAP Quartz Light
(sap_fiori_3)
Not SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot Supported

Supported
(Guideline=FIORI)

**Supported / Fallback
SAP Quartz Dark
(sap_fiori_3_dark)
Not SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot Supported

Supported
(Guideline=FIORI)

** Supported
SAP Quartz High Contrast Black 
sap_fiori_3_hcb 
Not SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedSupported
(Guideline=FIORI)
** Supported
SAP Quartz High Contrast White (sap_fiori_3_hcw)Not SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedSupported
(Guideline=FIORI)
** Supported
SAP Belize
(sap_belize)
Not SupportedNot SupportedNot SupportedNot SupportedNot SupportedSupported / Fallback (Guideline=FIORI)Supported / Fallback (Guideline=FIORI)Supported / Fallback (Guideline=FIORI)Supported / Fallback (Guideline=FIORI)** Supported
SAP High Contrast Black (sap_belize_hcb);
SAP High Contrast White (sap_belize_hcw)
Not SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot SupportedSupported (Guideline=FIORI)Supported (Guideline=FIORI)Supported (Guideline=FIORI)** Supported
SAP Blue Crystal
(sap_bluecrystal)
Not SupportedNot SupportedNot SupportedSupported from SP08SupportedNot SupportedNot SupportedNot SupportedNot SupportedNot Supported
SAP Corbu
(sap_corbu)
Not SupportedSupported from SP17Supported from SP04 / FallbackSupported from SP04 / FallbackSupported / Fallback*Supported / Fallback
(only in non Fiori with Guideline=20)
* Supported / Fallback
(only in non Fiori with Guideline=20)
* Supported / Fallback
(only in non Fiori with Guideline=20)
* Supported / Fallback
(only in non Fiori with Guideline=20)
Not Supported
SAP GoldReflection (sap_goldreflection)Not SupportedSupported from SP17Supported from SP04SupportedSupported

Supported
(only in non Fiori)

Supported
(only in non Fiori)
Supported
(only in non Fiori)
Supported
(only in non Fiori)
Not Supported
SAP Tradeshow Plus (sap_tradeshow_plus)Supported / FallbackSupported / FallbackSupportedSupportedSupportedDeprecatedDeprecatedDeprecatedDeprecatedNot Supported
SAP Tradeshow
(sap_tradeshow)
SupportedSupportedSupportedSupportedSupportedDeprecatedDeprecatedDeprecatedDeprecatedNot Supported
SAP High Contrast Black
(sap_hcb)
SupportedSupportedSupportedSupportedSupportedSupported

* Supported
(only in non Fiori with Guideline=20)

* Supported
(only in non Fiori with Guideline=20)
* Supported
(only in non Fiori with Guideline=20)
Not Supported
ThemesSAP_BASIS
701
SAP_BASIS
702
SAP_BASIS
731
SAP_UI
740
SAP_UI
750
SAP_UI
751
SAP_UI
752
SAP_UI
753
SAP_UI
754
SAP_UI
755 

Fallback theme is the default theme used on a certain release.

*Using FLP SAP_BELIZE is the fallback, otherwise SAP_CORBU

** Starting from SAP_UI 755 only FIORI Guideline is supported  (See SAP Note 2934021).

Glossary
  • Deprecated - Use not recommended. To be removed in future releases.
  • Not Supported - SAP does not give any guarantees about this functionality and does not provide any support.
Remarks
  1. SAP Belize, SAP Belize Deep and SAP Quartz Light (sap_belize, sap_belize_plus and sap_fiori_3):
    • Only supported in Standards Mode. No support for Quirks Mode (Compatibility Mode in IE).
    • The usage of fonts from a remote server must not be blocked in the web browser.
    • "SAP Belize" uses a row height of 32px. This is larger than previous themes and may result in additional scrollbars, less visible information on the screen or layout issues if an application uses fixed sizes.
    • The height of table rows is 24px (+1px for the grid line). This is larger than classic themes but smaller than "SAP Corbu "and "SAP Blue Crystal".
    • Can be used only with WDUIGUIDELINE=FIORI.
    • The name of the Guideline must be written in capital letters. (GL11, GL20, FIORI)
    • Currently there is no visual difference between the "SAP Belize" and "SAP Belize Plus" theme for Unified Rendering based applications.
  2. SAP Blue Crystal (sap_bluecrystal):
    • Only supported in Standards Mode. No support for Quirks Mode (Compatibility Mode in IE).
  3. SAP Gold Reflection (sap_goldreflection):
    • This theme is only an alias for "SAP Corbu" to allow common theming with the SAPUI5 "Gold Reflection" theme in the UI theme designer
No longer supported themes
      • SAP High Contrast (sap_highcontrast)
      • SAP Chrome (sap_chrome)
      • SAP Streamline (sap_standard) 

These themes are no longer supported as of Release 7.00.


Releases not mentioned in the Theming Support Matrix

  1. Supported themes for SAP_BASIS 7.00:
    • SAP Tradeshow (sap_tradeshow)
    • SAP High Contrast Black (sap_hcb)

  2. Supported themes for SAP_BASIS 7.30:
    • SAP Tradeshow Plus (sap_tradeshow_plus)
    • SAP Tradeshow (sap_tradeshow)
    • SAP High Contrast Black (sap_hcb)


Priority of stylesheets

The priority of style sheets increases as the scope reduces.

1. External style sheet:  in case of the WDA application is integrated in NWBC, Enterprise Portal or Fiori Launchpad  the external stylesheet will be used as default.

 The default value of parameter WDUSEEXTERNALSTYLESHEET is ON.    

The external stylesheet version should be equal or higher than the Web Dynpro style sheet version, otherwise the fallback theme will be displayed.


2080430 - How to find out the version of the SAP portal style sheets

2080443 - How to find out the version of the WD ABAP style sheets

2. Application setting: Each Web Dynpro Application can have parameter settings that may influence the chosen style sheet.

Please check the Application Parameters and URL Parameters for your release to see the available parameters for your release.

3. Global setting: If no external stylesheet or application parameter available, the Global parameters (Web Dynpro application: WD_GLOBAL_SETTING) will be taken into account. 

Troubleshooting


Error

The custom theme has distorted look


Custom themes must match the version of their used UI technologies.

Therefore custom themes must be updated after a UI technology has been updated. This can be accomplished by using the "Rebuild" function of the UI theme designer.

1888970 - UI theme designer - update of customer themes

2843432 - The interaction and importance of the frontend and the backend system for (custom) themes

2505163 - How to Rebuild custom themes in UI Theme Designer

Error

Fallback theme displayed instead of custom theme

The style sheet version number of the SAP Portal must be the same as or higher than the style sheet version of the WDA application.

If the style sheet version number of the portal is too low, you must adjust the portal accordingly. To do so, you must import the most recent portal SP, including the most recent patches (epbasis or epflp)

1446099 - Application (Web Dynpro or ITS) is not displayed in customer theme



Final Tip

The "Unified Rendering" and "Base" theming content is downward compatible, hence it is recommended to always implement the latest version available.

After implementing the note or installing a new service pack please rebuild your custom themes in the UI theme designer and test them ("Rebuild" option in the toolbar of the start screen).

To update your "Unified Rendering Themes" to the latest version available, please implement the note below:

SAP Note 2416790: Unified Rendering and Base Themes


Relevant SAP notes

2934021 - Support of visual themes for WDA/FPM in SAP_UI 7.55 (and higher)

2124106 - Themes for Unified Rendering based UI technologies (Web Dynpro ABAP/Java, BSP, SAPGUI for HTML, BI, JSF)

2789396 - Visual Design SAP Quartz for Unified Rendering based applications 

2379058 - Support of visual themes for WDA/FPM in SAP_UI 7.51 (and higher)

2328598 - Visual Design "SAP Belize" for Unified Rendering based applications

2000125 - Visual Design "SAP Blue Crystal" for Unified Rendering based applications. 

1446099 - Application (Web Dynpro or ITS) is not displayed in customer theme

2408180 - UI theme designer on ABAP: Latest Unified Rendering and Base Themes

2843432 - The interaction and importance of the frontend and the backend system for (custom) themes

2505163 - How to Rebuild custom themes in UI Theme Designer

End of mainstream Maintenance:

2583882 - Web Dynpro ABAP: End of Mainstream Maintenance for SAP_UI 740

2972680 - End of Mainstream Maintenance for SAP_UI 7.50 (SAPUI5 1.38)

2864280 - End of Mainstream Maintenance for SAP_UI 7.51 (SAPUI5 1.44)

2972656 - End of Mainstream Maintenance for SAP_UI 7.52 (SAPUI5 1.52)