Setzen von Stylesheets für HTMLB, XHTMLB und PHTMLB

Für das einheitliche Aussehen von BSP-Applikationen werden beim Einsatz der BSP-Extensions HTMLB, XHTMLB und PHTMLB Stylesheets verwendet. Falls Sie das standardmäßige Aussehen der HTMLB-, XHTMLB- oder PHTMLB-Bibliotheken verändern wollen, können Sie dies mit Hilfe des `ThemeRoot-Konzeptes` durchführen. In einem solchen Fall wird empfohlen, die Dateien aus dem MIME-Repository für die HTMLB, XHTMLB und PHTMLB-Bibliotheken zu kopieren, zu modifizieren und anschließend über die sogenannte ThemeRoot der BSP-Applikation bekannt zu machen.

BSP-Laufzeit und HTMLB-Manager enthalten aus diesem Grund eine Infrastruktur für die Handhabung von Pfaden zu anderen Lokationen, von denen aus man MIMEs einbinden möchte.

Voraussetzungen

Sie befinden sich in einem System ab SAP Web AS 6.20 und haben mindestens Support Package 7 implementiert.

Funktionsumfang

Wir empfehlen folgende Vorgehensweise für die Ablage des neuen Themas im MIME-Repository:

Legen Sie eine BSP-Applikation mit dem Namen zstyles an. Sichern Sie die Applikation.

Wechseln Sie in das MIME-Repository und legen Sie für die BSP-Applikation zstyles den Ordner myroot an. Kopieren Sie entsprechend der Struktur der von SAP ausgelieferten Themen alle Ordner bzw. MIME-Objekte in das Verzeichnis myroot.

Die von SAP ausgelieferten Themen finden Sie im MIME-Repository unter:

Release	Design	Pfad
Web AS 6.20	Classic	`/sap/public/bc/`
	Design2002	Wie Classic, also `/sap/public/bc/`, Jjedoch befindet sich der HTMLB-Ordner unter `/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	Wie Classic, also `/sap/bc/bsp/sap/public/bc/` jedoch befindet sich der HTMLB-Ordner unter `/sap/bc/bsp/sap/public/bc/htmlb/design2002`
	Design2003	`/sap/public/bc/ur/Design2002/themes/sap_standard/`

Unterhalb dieser Verzeichnisstruktur gibt es dann die folgenden Unterverzeichnisse mit ihren jeweiligen Dateien:

\HTMLB und \XHTMLB (für Design2002) bzw.
\UR, \common und \r (für Design2003)

Wechseln Sie in die Transaktion sicf.
Legen Sie den Alias zstyles an:
Klicken Sie dazu mit der rechten Maustaste auf den Knoten default_host/sap/public/bsp/sap und wählen Sie das erste Element Neues Subelement aus. Es erscheint ein Dialog, den Sie wie folgt pflegen:
- Name des anzulegenden Service-Elements: zstyles
- Typ des anzulegenden Service-Knotens: Alias auf einen bestehenden Service
- Bestätigen Sie mit OK.
  Es erscheint ein Dialog, in dem Sie das Alias-Ziel wie folgt pflegen: Führen Sie im Tabreiter Alias-Ziel auf den Eintrag default_host/sap/bc/bsp/sap/zstyles einen Doppelklick aus.
Sichern und aktivieren Sie den Service.

Hinweis
Die *.js-Dateien werden immer von ihrer ursprünglichen Lokation geladen.

Ende des Hinweises.

Um nun die neuen Verzeichnisse für Ihre BSP-Extensions und dadurch in Ihren BSP-Applikationen einzusetzen, verwenden Sie den URL-Parameter sap-themeRoot oder aber das Attribut themeRoot am <htmlb:content> BSP-Element.

Beispiel

Syntax Syntax

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

Ende des Codes

oder

Syntax Syntax

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

Ende des Codes

Achtung Achtung

Achten Sie bei den Angaben der externen Pfade auf das “URL-Escaping”. Üblicherweise wird z.B. der Doppelpunkt ( : ) als %3A und der Slash ( / ) als %2F kodiert.

Ende der Warnung.

Hier einige Beispiele mit dem “URL-Escaping” (%2F und %3A):

Syntax Syntax

Beispiel für /sap/bc/bsp/sap/zstyles/myRoot auf dem gleichen Host:

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

Ende des Codes

Syntax Syntax

Beispiel für /sap/bc/bsp/sap/zstyles/myRoot auf einem anderen 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

Ende des Codes

Beachten Sie bei der Verwendung der BSP-Extensions folgende Matrix der Design-Verfügbarkeit:

	Classic	Design2002	Design2003
HTMLB	√	√	√
XHTMLB		√	√
PHTMLB			√