(Includes screenshots)New Skin Management Part 3 – Example about how to change the image above WorkCentre from CRM7.0 Ehp1
Purpose
This wiki includes the exact steps about how to use customizing path “Define Path for CSS Files” to change the image at the top of the navigation bar. For example:
Before change:
After change:
Overview
Since CRM7.0 Ehp1, you can just define the path (URL) where your CSS file is located. If you add a CSS file, this file overwrites the standard CSS file provided by SAP. Instead of copying and pasting an existing skin and then adapting the copied skin to your requirements, you can simply create a CSS file and change.
Exact Steps
1.create your own picture and then import it to custom folder in skin workbench.
(T-code:spro -> Customer Relationship Management->UI Framework->UI Framework Definition->Skins and Icons->Access Skin Workbench)
2.copy a standard css file to your own and adjust it per you requirement.
Please note: If you add your own CSS files, you need to ensure that the syntax of these files is correct. Otherwise, the WebClient UI will be distorted.
Here we copy standard thtmlb_stand.css under thtmlb styles/sap skins/default/ in skin workbench to a new one.
rename it as thtmlb_new.css and change the image to the one we imported to skin workbench in previous step1.
Then let’s save it to desktop.
3.import new css file to my custom folder in skin workbench
(T-code:spro -> Customer Relationship Management->UI Framework->UI Framework Definition->Skins and Icons->Access Skin Workbench)
4. customize accordingly in “Define Path for CSS Files”
(T-code:spro -> Customer Relationship Management->UI Framework->UI Framework Definition->Skins and Icons->Define Path for CSS Files)
4.logon WebUI again and check the result
Related SCN Pages
1.If you want to know more about how to use css file or how to adjust skin, please check following Wiki link.
- How-to Guide: Copy and Adjust Skins (SAP CRM 7.0)
- (Includes screenshots) New Skin Management Part 1 – An easy way for logo and logo text exchange from CRM7.0 Ehp1
- (Includes screenshots)New Skin Management Part 2 – An easy way for CSS files adjustment from CRM7.0 Ehp1
Please let me know if you cannot see the screenshots.