Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
troy_cronin2
Active Contributor
Introduction

As older Netweaver (NW) 7.X become deprecated, upgrades are the recommended means of practices when it comes to obtaining the latest functionalities offered by newer Portal environment.

A vital point to highlight and consider surrounding NW & EP Versions is that by the end of 2017, EP 7.0X versions will no longer be supported, and therefore we suggest to upgrade to a higher version now and not wait till the last moment. We suggest an upgrade to a Product Version of EP 7.5, which has the longest maintenance period, and moreover, you have many new features including the Fiori Framework Page and other features that are only available in the latest versions.

Customizing Themes in a New Environment (NW 7.5+)

I've come across many scenarios in which customers are familiarizing themselves with some of the newer functionalities aligned with the latest NW Versioning. One such functionality corresponds to theming and the underlying tool through which this is handled i.e. the UI Theme Designer.

In terms of theming the UI Theme Designer is the newly released and newly available platform for both editing and generation. In terms of functional enhancements with the UI Theme Designer they key terms here are:

  • CSS

  • LESS

  • SAP UI5

  • SAP NW AS ABAP

  • SAP NW Portal

  • Usability

  • Flexibility


Within the blog posting you will find a comprehensive overview on the operational ehancements now available with new Product Versions and also the limitations which exist surrounding older releases (+ known issues).

In terms of strategic planning and preparation surrounding possible upgrades or any queries you might have the following documentation guide can be used as primary source of cross-referencing:

Theme Editor (Old NW Versions) & UI Theme Designer (New NW Versions)

The change or switch if you like to the UI Theme Designer becomes apparent in NW 7.31 SP16 as the structure changed. In NW 7.30 SP10 and NW 7.31 SP9 you can avail of the new theme designer As of NW 7.31 SP16 the default theme tool is UI Theme Designer (although you can revert back to the theme editor if desired).

  • SAP NW 7.50 will only support the UI Theme Designer


I'm unfamiliar with the UI Theme Designer

When you customize supported portal themes using the UI Theme Designer, you can preview changes you make to framework pages.

  1. Launch the UI Theme Designer > Content Administration > Portal Display > Portal Themes > UI Theme Designer

  2. Locate the them of interest and select > Edit

  3. Open the Preview Controls

  4. Select one of the supported Frameworks


The UI Theme Designer is the complete package in terms of being singular tool for theming and branding across many of SAP UI’s.

Specific Elements

I’ve come across scenarios in which issues arose when Portal Administrators or end-users needed to change specific elements. When utilizing the UI Theme Designer however they were unsure of how to identify the correct property that needed to be changed (to change the element display).

A great point of informative reference here is that of Noel’s blog below. This provides a great overview surrounding display areas of interest e.g. “TLN, Breadcrumb, DTN, Content Area”.

– How to… UI Theme Designer – Locating elements: https://blogs.sap.com/2014/01/10/how-to-use-the-ui-theme-designer-part-2/

The best approach in terms of changing “specific” Portal elements and property settings would be to use the advanced CSS Settings.

 



 

 

If you select the “Expert” option in the UI Theme Designer when you theme of choice is opened you should be able to use the “Magnifying Glass” to change the corresponding properties in the preview (based on your preference).

This option will allow you to select anywhere (with mouse) on screen and edit the corresponding properties in the right hand column