How to create a fallback portal theme in UI Theme Designer

[herman_lin]

• The theme fallback mechanism checks if a theme can be applied to an application and selects a fallback theme if the specified theme is not valid.


• Whether a given theme is supported by an application depends on the underlying UI technology and its version. The theme fallback mechanism automatically detects a valid theme for an application. A default fallback chain of SAP standard themes is used by the fallback mechanism. In addition, you can define a chain of custom themes as fallback themes. Refer to Theme Fallback .


• You would like to define/create a fallback portal theme using UI Theme Designer in a new LESS mode structure Portal, which could be used later in a circumstance of current theme is not valid for application to be rendered for example.


• This blog introduces you with the detail steps of how to create fallback theme in detail.

Procedure:

Define fallback theme for an existing custom theme:

1. Log On Portal using administrator user and Launch the UI Theme Designer: Content Administration -> Portal Display -> Portal Themes -> UI Theme Designer.


2. From "Filter Themes"-> All, select the custom theme(e.g. custom_standard) for which you want to create a fallback theme. Then click on "Edit Properties" button on the right pane.


3. On opened properties window, fill in the exact Theme ID(e.g. custom_bluecrystal) for property "Fallback Theme ID" for the theme(e.g. custom_standard) you want to set a fallback theme for.
   


4. Click on " OK" button. And now Theme custome_bluecrystal is fallback of Theme custom_standard.
   

Define fallback theme for a new custom theme:

1. Select a SAP standard theme(e.g. sap_bluecrystal) that displayed in the list from "Filter Themes"-> All and click on "Open" button.


2. Perform customizing on the theme as you like. Refer to help link for more detail.


3. Click on "Theme" at left up corner and select option "Save & Build".


4. On opened window, enter the Theme ID(e.g. custom_standard) for property "Fallback Theme ID" as the new Theme ID to be saved. Meanwhile, you are able to see "custom_bluecrystal_3" will be automatically filled in for property "Theme ID".
   


5. Click on "Save & Build" button and you will get a progress bar showing the build progress running.
   


6. Click on "OK" button after you see a complete message.


7. Now theme (e.g. custom_standard) is fallback of theme (e.g. custom_bluecrystal_3).