- SAP Managed Tags:
Now so far in Part one we covered the basics behind the Portal Themes such as the permissions involved and the elements of interest while Part 2 gave us extra insight into the two primary mechanisms behind theme creation (1) Theme Editor (2) UI Theme Designer.
If you missed Part 1 & 2 you can review them at your convenience via the links below:
EP: Theming A Simple Overview Part 1
troy.cronin2/blog/2016/02/02/ep-theming-a-simple-overview-part-1
EP: Theming - Theme Editor VS UI Theme Designer Part 2
Now in this third part we are going to cover the fundamental process behind creating a custom theme and the steps involved throughout.
I figure I will break this blog posting into two separate parts with each offering an overview on the differences in creating a theme between (1) Theme Editor & (2) UI Theme Designer.
Important!
As with any Portal protocol that involves editing/creation, careful planning and diligence is required. After all we do not want to create themes which contribute negatively in terms of aesthetic appeal to the overall look and feel of the Enterprise Portal.
Theme Editor - Planning
So you have taken the decision to go and create a custom theme using the Theme Editor. Through utilization of the Theme Editor you are able to create multiple themes for all Portal Users. Each theme you create (custom theme) is based upon a SAP Standard Theme template with which you tailor the visual elements to meet your own organizational business requirements.
For example you might want to change the color coding, background images or general balance of display. If your company logo incorporates traits of the rainbow you might want to have a specific colour coding across the Portal display which is indeed feasible. Now finally as here we are talking about planning you will need to ensure firstly that you have the correct authorizations to go ahead and create a theme (Content Admin) and assigning it to a desktop (Super Admin).
The Beginning
Now after some brainstorming and discussions with your colleagues regarding the theme you've generated (in your mind) the potential schema that the theme is going to follow (let us stick with the example of the rainbow).
In order to work towards achieving the desired setup the first thing you must do is select and start tailoring one of the SAP Standard Themes which is then saved as a custom theme (new name). The SAP Standard Themes themselves are non-editable (essentially they are hard-coded). The main point of interest to you (as theme creator) is the properties of the SAP Standard Themes as these properties and parameters are going to serve as the core baseline upon which your custom theme is created.
Planning Complete! - Open the Theme Editor
- Login to the Enterprise Portal > Content Administration > Portal Display > Portal Themes > Theme Editor.
- View the Themes > Select the Dropdown Menu > (Choose any Standard Theme You Want).
- Open the Elements Dropdown
- View the Element Properties and select the ones to which you want to make changes.
Elements - Overview
- All - As the name suggests if you select this in the drop-down you've made a decision to edit all elements in the theme.
- Ajax Framework Page (AFP) - Elements in association to the "Navigation" areas of the framework page itself
- Classic Framework Page (CFP) - Elements in association to the "Navigation" areas of the framework page itself
- Application: Elements pertaining to the display of application within the Portal's content Area.
Preview & Elements
You have the option to view SAP Standard Themes alongside the elements you have selected. This will essentially create a mock-up display of the process to come before you continue towards creating the rainbow based display :wink: .
Open
- Choose "Open" to open the Theme editor.
- If you view the left of the screen you can select one of the user-face theming elements.
- The parameters which essentially go into making up this UI will be shown here.
- If you go through the parameters you can Preview each.
- Now you can go about customizing as you please.
Save
- Select "Save As" to save the template .e.g RainbowCustomTheme
- Fill in the necessary i.e. Theme Name & Theme ID. Remember to save the theme in the theme folder or one of its subfolders!!!
- Once saved you should now be able to view and select the theme in the Theme Editor within the option "My Themes".
Part 4 Coming Soon - Theming - Creating A Theme (UI Theme Designer)
