We all know that the new rendering engine for the BI 7.0 Web Templates is Java and that to use these new templates we need to have a Java stack with the portal. SAP has basically improved the integration of BI reports with portal by changing the rendering engine from the ABAP stack to the Java Stack with a Portal.
What this means is that the Portal theme, which you define for your Corporate Portal, will define the Look and Feel Aspects of your BI 7.0 Web Templates as well.
As mentioned in earlier blog by Prakash Darji, that the CSS files which control the portal themes are located on the portal file system. SAP NetWeaver 2004s BI - Define your Publishing Strategy Part 2
The components which contain these CSS files are:
com.sap.portal.design.portaldesigndata and com.sap.portal.design.urdesigndata. They have the CSS files related to the portal themes. You can get a hold of these CSS files and edit them manually to get the look and feel you need for you implementation.
Portal Theme Editor and Unified Rendering Framework
There is also a tool available in the portal called the portal Theme Editor. Through this you get a UI based tool to change the Look and Feel of the portal in a theme as a whole. This is also the easiest way to change the look and feel of the BI 7.0 Web Templates in your portal.
In this section there are various sections which contain different portal elements. For earlier releases of SAP BW ( 3.X, 2.X) there are separate sections to define the look and feel of the Web templates when viewed through the portal. The image below shows the options available:
The Look and Feel of BI 7.0 Templates are not affected by the setting which you make here. The integration is much deeper than that it can ensure that the Look And Feel follows the exact colours chosen by you for your portal. This is the Unified Rendering Framework.
The BI 7.0 templates L-A-F is defined ( as you may have already guessed) by the options/colours defined for your normal portal components like Button, tables, Tree navigation etc i.e. the settings other than the Component Specific Styles. Some images are shown below for reference:
SAP has published a help document for the same to explain this integration. The link is:
http://help.sap.com/saphelp_nw2004s/helpdata/en/44/317d1f955e3f0ae10000000a114a6b/frameset.htm
This document does not talk about which element corresponds to which Web Item in the BI Web Template. With implementation I have made some findings about these relations. These are listed below: I am not sure whether these are all of them, so If I find more, the blog will be updated, and if you know more then please comment and I will add those entries here:
These elements lie under the Complex Elements, Simple Elements and Global Styles section in the portal Theme Editor
BI 7.0 Web Elements | Portal Theme Editor Elements |
All corresponding Group , Web Items | Group. The images shows some elements which you can change: |
Tables based Web Items like Tables, Report, Analyse etc These normally show results in the BI Template. You can define the colours for different table headers, rows , type of data etc. | Tables |
Context Menu properties | Pop Up Menu. The settings here will define which how your context menu in BI 7.0 Web Template will look like. |
Navigation Ranges, Hierarchical Filters etc | Tree. This will define the colour for all navigational hierarchy based web items in the BI 7.0 Web Templates. |
Wizard Item | Roadmaps. Correspond to the colours in all wizard item implementation |
Container Layout Web Item | Tool Bar. This will define the Look and Feel for the Container Layouts Button Groups Layout in the Web Template |
Cursor Web Item | Cursor |
Text Web Item | Text |
Buttons / Button Group | Buttons |
Tab Page Web Item | Tab Strip |
I am not sure of the web item here, but the effect is quite literal | Date Navigator |
Links Web Item | Links |
Hope this web log helps you in working with BI 7.0 Web Templates in the new Runtime. Please do post your comments here.