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: 
bruce_li
Contributor

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.

Related SAP Notes/KBAs

1 Comment