Setting Stylesheets for HTMLB, XHTMLB, and PHTMLB

To standardize the appearance of BSP applications HTMLB, XHTMLB, and PHTMLB stylesheets are used when BSP extensions are in use. You can change the default appearance of HTMLB, XHTMLB, or PHTMLB libraries by using the "themeRoot concept". If you do change the appearance we recommend you copy and modify the files from the MIME Repository for the HTMLB, XHTMLB, and PHTMLB libraries, and then make them known to the BSP application using the theme root.

For this reason, the BSP runtime and HTMLB manager contain an infrastructure for handling paths to other locations, from where you may want to insert MIMEs.

You are using a system from SAP Web AS 6.20 and have implemented at least Support Package 7.

We recommend the following procedure for storing the new themes in the MIME repository:

1. Create a BSP application with the name zstyles. Save the application.

2. Switch to the MIME repository and create the folder myroot for the BSP application zstyles. Copy all the folders or MIME objects relevant to the structure of the themes provided by SAP into the myroot directory.

   You can find the themes provided by SAP in the MIME repository under:

   Release	Design	Path
   Web AS 6.20	Classic	/sap/public/bc/
   Design2002	As with classic, that is /sap/public/bc/. Though the HTMLB folder is under /sap/public/bc/htmlb/design2002.
   Design2003	/sap/public/bc/ur/Design2002/themes/sap_standard/
   Web AS 6.40	Classic	/sap/bc/bsp/sap/public/bc/
   Design2002	As with classic, that is /sap/bc/bsp/sap/public/bc/. Though the HTMLB folder is under /sap/bc/bsp/sap/public/bc/htmlb/design2002.
   Design2003	/sap/public/bc/ur/Design2002/themes/sap_standard/

   Below this directory structure there are the following subdirectories with their associated files:

   • \HTMLB and \XHTMLB (for Design2002) or

   • \UR, \common and \r (for Design2003)

3. Switch to transaction sicf.

4. Create the alias zstyles:

   Click the right mouse button on the node default_host/sap/public/bsp/sap and select the first element New Subelement. A dialog box appears. Enter the following information:

   • Name of the service element to create: zstyles

   • Type of the service node to create: Alias of an existing service

   • Choose OK to confirm.

     A dialog box appears in whcih you enter the target alias as follows: On the tab page Alias Target double-click the entry default_host/sap/bc/bsp/sap/zstyles.

5. Save and activate the service.

   Note

   The *.js files are always loaded from their original location.

To use the new directories for your BSP extensions and, therefore, in your BSP applications, use the URL parameter sap-themeRoot or the attribute themeRoot of the <htmlb:content> BSP element.

sap-themeRoot=/sap/bc/bsp/sap/zstyles/myRoot/
         

or

<htmlb:content design="design2002" 
           themeRoot="/sap/bc/bsp/sap/zstyles/myRoot/">
         

Here are a few examples with "URL escaping" ( %2F and %3A):

Example for /sap/bc/bsp/sap/zstyles/myRoot on the same host:

http://host.domain.ext:port/sap/bc/bsp/sap/sbspext_htmlb/button.bsp?
sap-themeRoot=%2Fsap%2Fbc%2Fbsp%2Fsap=%2Fzstyles%2FmyRoot=%2F

         

Example for /sap/bc/bsp/sap/zstyles/myRoot on another host:

http://host.domain.ext:port/sap/bc/bsp/sap/sbspext_htmlb/button.bsp?
sap-themeRoot=http%3A%2F%2Fanother.host.domain.ext%3Aport%2Fsap%2Fbc%2Fbsp%2F
sap=%2Fzstyles%2FmyRoot=%2F
         

When you use BSP extensions keep in mind the following matrix of the design availability: