Vorheriges Thema: Design-VerknüpfungenNächstes Thema: Verwenden mehrerer Designs

Branding der Benutzerkonsole › Erstellen von Designs

Erstellen von Designs

Das Erstellen eines Designs umfasst die folgenden Schritte:

  1. Kopieren eines vorhandenen Designs
  2. Aktualisieren der Bilder des Designs
  3. Aktualisieren der Farben und Schriftarten des Designs
  4. Anpassen der .properties-Datei
  5. Anpassen der index.jsp-Datei

Kopieren eines vorhandenen Designs

Führen Sie den folgenden Vorgang aus, um ein vorhandenes Design zu kopieren.

Gehen Sie wie folgt vor:

  1. Schauen Sie sich die Abbildungen in CA Identity Manager Skins an, und entscheiden Sie, welches der folgenden Designs dem ähnlich ist, das Sie für Ihr Unternehmen erstellen möchten:

    Zur Veranschauung wird in diesem Abschnitt angenommen, dass Sie das neteauto-Design auswählen und es yourskin nennen. Der Name yourskin ist der Name des Designs Ihres Unternehmens.

  2. Kopieren Sie die folgende Datei:

    iam_im.ear/user_console_war/app/imcss/neteauto

    iam_im.ear/

    Geben Sie ihr den folgenden Namen:

    iam_im.ear/user_console_war/app/imcss/yourskin

  3. Benennen Sie im "yourskin"-Verzeichnis die folgenden Dateien um:

Aktueller Name

Neuer Name

neteauto.css

yourskin.css

neteauto_task.css

yourskin_task.css

neteauto.properties

yourskin.properties

Um die Verwaltung zu vereinfachen, sollten die Namen der .properties-Datei und der .css-Dateien mit dem Namen des Designs korrespondieren.

Hinweis: Bei Design-Namen muss die Groß-/Kleinschreibung beachtet werden.

Aktualisieren der Bilder des Designs

Aktualisieren Sie alle Bilder (GIF, JPG oder PNG) in den folgenden Verzeichnissen mit den Bildern die dem Design Ihres Unternehmens entsprechen:

Um zum Beispiel das Logo Ihres Unternehmens in das yourskin-Design zu integrieren, ersetzen Sie "logo.jpg" im Bildverzeichnis durch das Logo Ihres Unternehmens.

Wir empfehlen, für die Bilddateien die gleichen Namen zu verwenden, da viele dieser Bilder bereits den entsprechenden Pfaden in der "yourskin.properties"-Datei zugeordnet sind.

Aktualisieren der Farben und Schriftarten des Designs

Aktualisieren Sie die Cascading Style Sheets des yourskin-Designs mit den Schriftarten und den Menü-, Hintergrund-, Rand- und anderen Farben Ihrer Wahl.

Die Pfade zu den Stylesheets sind folgendermaßen:

Anpassen der .properties-Datei

Führen Sie den folgenden Vorgang aus, um die .properties-Datei anzupassen.

Gehen Sie wie folgt vor:

  1. Ersetzen Sie in der "yourskin.properties"-Datei jede neteauto-Referenz durch yourskin.
  2. Führen Sie die folgenden zusätzlichen Änderungen an der "yourskin.properties"-Datei aus:
    1. Wenn noch angegeben, legen Sie das Folgende im übergeordneten Abschnitt fest: 
          parent=/app/imcss/idm/im.properties

      Der übergeordnete Abschnitt gibt den Speicherort in der .properties-Datei des übergeordneten Designs an. In diesem Beispiel ist idm das übergeordnete Design.

    2. Legen Sie die Cascading Style Sheets folgendermaßen fest: 
          stylesheet/skin.css=yourskin/yourskin.css
    stylesheet/skin_task.css=yourskin/yourskin_task.css
    3. Fahren Sie folgendermaßen fort:

      Wenn Sie die Bilder im Design ersetzten, ohne sie umzubenennen, fahre Sie mit Schritt d. fort. Wenn Sie die Images umbenannten haben, machen Sie das Folgende:

      • Bestimmen Sie im Header-Bilder-Abschnitt den Pfad zu den im Schritt Aktualisieren der Bilder des Designs festgelegten Header-Bildern.

        Sie können mehrere Bilder zur .properties-Datei hinzufügen, indem Sie einen Eintrag wie den Folgenden hinzufügen:

        image/logo.gif=yourskin/image/logo.jpg

      • Bestimmen Sie im Standardregisterkarten-Abschnitt den Pfad zu den im Schritt Aktualisieren der Bilder des Designs festgelegten Registerkartenbildern.
      • Bestimmen Sie im Aufgabenschaltflächen-Abschnitt den Pfad zu den im Schritt Aktualisieren der Bilder des Designs festgelegten Bildern für die Aufgabenschaltflächen.
    4. Speichern Sie die Datei.

Weitere Informationen:

Aktualisieren der Bilder des Designs

Anpassen der index.jsp-Datei

Führen Sie den folgenden Vorgang aus, um die "index.jsp"-Datei anzupassen.

Gehen Sie wie folgt vor:

  1. Öffnen Sie die "index.jsp"-Datei in einem Texteditor. Diese Datei befindet sich im folgenden Ordner:

    <iam_im.ear>/user_console_war/app/imcss

  2. Fügen Sie unter dem <skin:update>-Abschnitt Folgendes als ersten Eintrag hinzu: 
    <skin:skin name="yourskin" filename="/app/imcss/yourskin/yourskin.properties" />
  3. Speichern Sie die Datei.

CA Identity Manager wählt als Standarddesign für die CA Identity Manager-Benutzerkonsole auf Grundlage des Design-Tags aus, das zuerst im <skin:update>-Abschnitt der "index.jsp"-Datei aufgelistet ist.

Bei dem folgenden <skin:update>-Abschnitt der "index.jsp"-Datei wird CA Identity Manager die Benutzerkonsole im yourskin-Design anzeigen:

<skin:update>

<skin:skin name="yourskin" filename="/app/imcss/yourskin/yourskin.properties" />
<skin:skin name="idm" filename="/app/imcss/idm/im.properties" />
<skin:skin name="neteauto" filename="/app/imcss/neteauto/neteauto.properties" />
<skin:skin name="horizontal" filename="/app/imcss/horizontal/horizontal.properties" />
<skin:skin name="horizontal2" filename="/app/imcss/horizontal2/horizontal2.properties" />

</skin:update>

Wenn Sie ein anderes Design verwenden möchten, müssen Sie die Reihenfolge der aufgelisteten Skin-Tags ändern.

Neukompilieren der JSP-Dateien und Neustart des Anwendungsservers

Wenn Sie CA Identity Manager auf einem JBoss-Anwendungsserver ausführen und ein neues Design erstellt haben, müssen Sie die JSP-Dateien neu kompilieren und den Anwendungsserver neu starten. Gehen Sie folgendermaßen vor:

  1. Konfigurieren Sie Ihren Anwendungsserver, um alle "console.jsp"-Dateien neu zu kompilieren.
  2. Starten Sie den Anwendungsserver neu, sodass die Änderungen am yourskin-Design angewendet werden.

Hinweis: Wenn Sie einen anderen Anwendungsserver verwenden, müssen Sie diesen Schritt nicht ausführen.