Designvorgaben für Web-Interfaces 

Verwendung

Das optische Erscheinungsbild eines Web-Interfaces wird durch die im Web Interface Builder verwendeten Designvorgaben festgelegt. Abhängig davon, ob Sie das neue oder das Alte Design verwenden, unterscheidet sich die Art und Weise, wie dies geschieht.

Funktionsumfang

Neues Design (BW-BPS)

Im neuen Design wird das optische Erscheinungsbild eines Web-Interfaces durch ein sog. Theme festgelegt. Jedes Theme wird durch einen Satz MIME-Dateien für das HTML-Rendering definiert (CSS(Cascading Style Sheet)-Dateien, Bilder, JavaScript-Dateien), die im MIME-Repository abgelegt sind.

Weitere Informationen zu den Prinzipien eines Theme finden Sie in der Dokumentation zu den Business Server Pages unter Setzen von Stylesheets für HTMLB, XHTMLB und PHTMLB.

SAP liefert mehrere vordefinierte SAP-Themes aus:

●     sap_standard

●     sap_tradeshow (Standardeinstellung)

●     sap_chrome

●     sap_highcont

●     sap_hcb

Sie können diese SAP-Themes über die Wetehilfe zum Feld Theme Pfad auswählen.

Wenn Sie das optische Erscheinungsbild Ihren eigenen Vorstellungen anpassen möchten, können Sie auf der Grundlage der ausgelieferten SAP-Themes ein eigenes Theme erstellen und die Stil-Klassen in Ihrem Theme Ihren Anforderungen entsprechend anpassen.

Um das optische Erscheinungsbild Ihres Web-Interfaces anzupassen, ist dies der einfachste Weg: Wenn Sie Ihr Web-Interface im SAP Enterprise Portal verwenden, rufen Sie über Systemadministration ® Portalanzeige den Motiveditor auf. Sie müssen die komponenten-spezifischen Stile anpassen. Ein Web-Interface verwendet die folgenden Stile: Application, Button, Cursor, Label und Field, Link, Text, Group, List, Table, Tree. Das optische Erscheinungsbild des Planungslayouts wird durch die „BI-Web-Reports 3.0“-Stile festgelegt.

Wenn Sie ein Web-Interface im SAP Enterprise Portal verwenden, bedingt die Kombination des BW-Stylesheets 3.0 und der anderen komponentenspezifischen Stile, dass die Font-Größe in den Planungslayouts Ihres Web-Interfaces zu klein sein könnte, wenn Sie eine absolute Font-Größe in bestimmten Klassen des BW-Stylesheets 3.0 verwenden. 

Daher dürfen Sie in diesen Klassen des BW-Stylesheets 3.0 entweder keine Festlegungen zur Font-Größe oder nur eine (zum Eltern-Element Font-Größe) relative Font-Größe verwenden.

Die Font-Größe kann diese Werte haben: larger, smaller, <number>%, <number>em.

Die folgenden Klassen des BW-Stylesheets 3.0 unterliegen dieser Festlegung:

SAPBEXTableGrid

SAPBEXCellspacing

SAPBEXchaText

SAPBEXaggItem

SAPBEXstdItem

SAPBEXHLevel0

SAPBEXHLevel1

SAPBEXHLevel2

SAPBEXHLevel3

SAPBEXaggData

SAPBEXstdDataOdd

SAPBEXstdData

SAPBEXDataErr

Wenn Sie Ihr Web-Interface nicht im SAP Enterprise Portal verwenden und das optische Erscheinungsbild anpassen möchten, müssen Sie im BI-System manuell ein eigenes Theme erstellen und anpassen.

Weitere Informationen und ein einfaches Beispiel finden Sie unter Eigenes Stylesheet verwenden (neues Design).

Altes Design (SEM-BPS: altes und neues SEM-BPS-Design)

Im alten Design wird das optische Erscheinungsbild eines Web-Interfaces durch ein von SAP ausgeliefertes vordefiniertes Stylesheet festgelegt. Wenn Sie diese Formatvorlage Ihren eigenen Vorstellungen anpassen möchten, könnten Sie eine zusätzliche CSS-Datei anlegen und verwenden. Sie können für jede Seite Ihres Web-Interfaces eine solche zusätzliche Formatdatei definieren.

Wenn Sie Ihr Web-Interface auf der Grundlage des alten Designs in das Enterprise Portal integriert und die Formatvorlage des Portals geändert haben, müssen Sie die Formatvorlage des Web-Interfaces separat anpassen.

Weitere Informationen finden Sie unter:

CSS-Klassen für Web-Interfaces (altes Design)

CSS-Klassen für Web-Interfaces modifizieren (altes Design)

Aktivitäten

●     Wenn Sie ein Web-Interface anlegen, verwenden Sie automatisch das neue Design.

●     Wenn Sie ein Web-Interface bearbeiten, das mit dem alten Design angelegt wurde, können Sie entweder auf dieselbe Weise weiterarbeiten, oder auf das neue Design wechseln.

Um das neue Design einzustellen, wählen Sie in der Eigenschaft Altes Design des Web-Interfaces den Wert false.

●     Ein Wechsel vom neuen Design zum alten Design ist nicht möglich.