Change the stylesheet theme used by your web dynpro and portal apps (i.e. SAP_TRADESHOW, SAP_CORBU)

Changing the stylesheet theme of a SAP web dynpro application is quite straight forward and can be done at a global level or at an individual wdp application level.

When you change themes it all depends on the individual app to whether it instantly looks better or not. For example If you change from SAP_TRADESHOW to the new SAP_CORBU there is sometimes a bit of work to do first, mainly because the text on corbu is a little larger so may not fit in the original space as neatly.

Anyway to the point of this article, in-order to set the theme for web dynpro apps you need to follow these simple steps.

• Method 1 - Set default stylesheet for all web dynpro portal applications

Step 1 - Execute transaction SICF
On the first screen of t-code SICF simply press the execute button with the defaulted values.


Step 2 - Find application
On the next screen find the the application WD_GLOBAL_PARAMETERS within the host/services tree structure. It will be within something along the lines of default_host->sap->bc->webdynpro->sap->WD_GLOBAL_PARAMETERS


Step 3 - Alternate method
Alternatively you could have typed the service name WD_GLOBAL_PARAMETERS into the first selection screen of transaction SICF. If this is the first time you have used this transaction it is good to get a feel for where everything is and how it is structured.


Step 4 - Execute global parameters application
Once you have found the application ensure it is active, if not right click on it and select "Activate service". Then right click and select "Test service", it may ask you to login with your SAP login details.


This opens up a web application with a number of parameters that can be set, one of which is Stylesheet URI (WDTHEMEROOT).



Step 5 - Change stylesheet/theme
Press the change button and update this parameter to the one you want it to be I.e. SAP_CORBU and press save


Step 6 - Example changes
So if you change from SAP_TRADESHOW(left) to SAP_CORBU(right) this is and example of the differences you could see.




• Method 2 - Update stylesheet theme of individual SAP web dynpro application
You may have noticed above that when you executed WD_GLOBAL_PARAMETERS (see above) via the test option that all the parameters had technical names in brackets i.e. WDTHEMEROOT. It is this parameter name that you can use on your individual applications.
Step 1 - open individual wdp application
First execute tcode SE80 and select your ABAP web dynpro component/Interface. Now double click on the application you want to set the stylesheet/theme for.


Step 2 - Add stylesheet parameter
Within the right hand screen select the parameters tab and enter the "WDTHEMEROOT" parameter with the value of the stylesheet you want to use i.e. SAP_CORBU. All them other parameter from WD_GLOBAL_PARAMETERS can also be entered here.


Also see how to Disable User Personalisation with your web dynpro application


Related Articles

Add programmed/OVS search help to FPM ESS/MSS application via enhancement to CL_HRESS_PER_DETAIL
BIND_STRUCTURE method of interface IF_WD_CONTEXT_NODE to assign structure to context
BIND_TABLE method of interface IF_WD_CONTEXT_NODE
Get the name of the button the user has clicked on within the SAP web dynpro action ABAP code
Create field Refering to datatype of webDynpro context element
WebDynpro context for creation of screen field including standard search help
Disable SAP User Personalisation in Web Dynpro app using WDDISABLEUSERPERSONALIZATION and WDENABLEUIELEMENTSHIDE
GET_ATTRIBUTE method of interface IF_WD_CONTEXT_NODE to retrieve value of context element
GET_SELECTED_ELEMENTS to get selected row of ABAP web dynpro table when not using lead selection
GET_STATIC_ATTRIBUTE_TABLE method to return all rows of a context table node
IF_WD_CONTEXT_NODE interface methods withn ABAP Web Dynpro to enable users to view and change data
ABAP code to manually trigger ABAP web dynpro plug
Popuate SAP WebDynpro field
Freely Programmed search help for your web dynpro application (custom value help/OVS)
Change the stylesheet theme used by your web dynpro and portal apps (i.e. SAP_TRADESHOW, SAP_CORBU)
SET_ATTRIBUTE method of interface IF_WD_CONTEXT_NODE to assign value to individuale context attribute
Clear context attribute using SET_ATTRIBUTE_NULL method of interface IF_WD_CONTEXT_NODE
Add Dropdown by index UI Element to table field within abap web dynpro
Add freely Programmed search help to a web dynpro application field
Retrieve SAP webDynpro field value entered by user
ABAP Web dynpro ALV report table
Hide fields of a web dynpro ALV table
Display web dynpro ALV report select options to resict output results
Assign value to ABAP web dynpro context via table, structure or individual attribute
Get selected ABAP Web dynpro dropdown byindex value (dropdownbyindex UI element)
ABAP web dynpro Dropdown by index UI Element allows a field to display a drop down list of values
ABAP web dynpro Dropdown default value, allow you to set current value of dropdown UI element
Change SAP web dynpro logon screen
Read ABAP Web dynpro table context on action / button click
ABAP Web Dynpro tables to allow users to view and change data
Get selected row of ABAP web dynpro table
Get all selected rows of table within your web dynpro for ABAP applications using GET_SELECTED_ELEMENTS
Get selected row of ABAP web dynpro table
ABAP Web Dynpro tree structure, display HR org structure as example
SAP ABAP Web Dynpro UI elements
View Container UI Element to display a web dynpro view within a wdp view
ALV ABAP Web Dynpro application
ABAP Web dynpro button click / Action
Call URL from SAP Webdynpro for ABAP ACTION
Call URL from SAP Webdynpro for ABAP ACTION
Display popup screen within ABAP Web dynpro
ABAP Web dynpro populate table on action / button click
ABAP code to Print abap web dynpro table
Adding URL parameters to you ABAP webdynpro to change thinks like the CSS