Konfigurieren von Standardkomponenten im Design-Modus

Letzte Aktualisierung: 2023-11-07
  • Themen:
  • Authoring
    Weitere Informationen zu diesem Thema
  • Erstellt für:
  • User

Wenn die AEM-Instanz direkt installiert wird, ist im Komponenten-Browser sofort eine Auswahl von Komponenten verfügbar.

Darüber hinaus sind auch verschiedene weitere Komponenten verfügbar. Mithilfe des Design-Modus können Sie diese Komponenten aktivieren bzw. deaktivieren. Wenn Sie den Design-Modus aktivieren und sich auf der Seite befinden, können Sie damit Aspekte des Komponenten-Designs konfigurieren, indem Sie die Attributparameter bearbeiten.

HINWEIS

Bei der Bearbeitung dieser Komponenten ist Vorsicht geboten. Die Designeinstellungen sind häufig ein wesentlicher Bestandteil des Designs der gesamten Website. Daher sollten sie nur von einer Person mit den entsprechenden Berechtigungen (und der erforderlichen Erfahrung) geändert werden (meist ein Administrator oder Entwickler). Weitere Informationen finden Sie unter Entwicklung von Komponenten.

HINWEIS

Der Design-Modus steht nur für statische Vorlagen zur Verfügung. Vorlagen, die mit bearbeitbaren Vorlagen erstellt wurden, sollten mit dem Vorlageneditor bearbeitet werden.

HINWEIS

Der Design-Modus ist nur für Design-Konfigurationen verfügbar, die als Inhalt unter ( /etc) gespeichert sind.

Ab AEM 6.4 wird empfohlen, Designs als Konfigurationsdaten unter /apps zu speichern, um kontinuierliche Bereitstellungsszenarien zu unterstützen. Unter /apps gespeicherte Designs können nicht zur Laufzeit bearbeitet werden. Außerdem steht der Design-Modus in Bezug auf diese Vorlagen ausschließlich Admins zur Verfügung.

Dazu müssen die zulässigen Komponenten im Absatzsystem für die Seite hinzugefügt oder entfernt werden. Das Absatzsystem (parsys) ist eine zusammengesetzte Komponente, die alle anderen Absatzkomponenten enthält. Mit dem Absatzsystem können Komponenten unterschiedlicher Typen zu einer Seite hinzugefügt werden, da es alle anderen Absatzkomponenten enthält. Jeder Absatztyp wird als eine Komponente dargestellt.

Beispielsweise kann der Inhalt einer Produktseite ein Absatzsystem enthalten, das Folgendes enthält:

  • Ein Bild des Produkts (in Form eines image- oder textimage-Absatzes)
  • Die Produktbeschreibung (als text-Absatz)
  • Eine Tabelle mit technischen Daten (als table-Absatz)
  • Ein Formular, das ausgefüllt werden kann (als forms begin-, forms element- und forms end-Absatz)
HINWEIS
VORSICHT

Bearbeiten des Designs im Design-Modus wie in diesem Artikel beschrieben ist die empfohlene Vorgehensweise zum Definieren von Designs statischer Vorlagen

Das Ändern von Designs beispielsweise in CRX DE ist keine Best Practice und die Anwendung solcher Designs kann vom erwarteten Verhalten abweichen. Weitere Informationen finden Sie im Entwicklerdokument Seitenvorlagen – statisch.

Aktivieren/Deaktivieren von Komponenten

So aktivieren oder deaktivieren Sie eine Komponente:

  1. Wechseln Sie in den Design-Modus.

    screen_shot_2018-03-22at103113

  2. Tippen oder klicken Sie auf eine Komponente. Diese Komponente wird mit einem blauen Rahmen versehen, wenn sie ausgewählt wird.

    screen_shot_2018-03-22at103204

  3. Klicken oder tippen Sie auf das Symbol Übergeordnetes Element.

    Übergeordnetes Element

    Dadurch wird das Absatzsystem mit der aktuellen Komponente ausgewählt.

  4. Die Konfigurieren -Symbol für das Absatzsystem wird in der Aktionsleiste des übergeordneten Elements angezeigt.

    Konfigurieren

    Wählen Sie dieses Symbol, um das Dialogfeld anzuzeigen.

  5. Legen Sie in diesem Dialogfeld fest, welche Komponenten im Komponenten-Browser verfügbar sein sollen, wenn die aktuelle Seite bearbeitet wird.

    screen_shot_2018-03-22at103329

    Das Dialogfeld enthält zwei Registerkarten:

    • Zugelassene Komponenten
    • Einstellungen

    Zugelassene Komponenten

    Auf der Registerkarte Zugelassene Komponenten legen Sie fest, welche Komponenten für das ParSys verfügbar sein sollen.

    • Die Komponenten werden nach Komponentengruppen gruppiert, die sich erweitern und reduzieren lassen.
    • Es kann eine ganze Gruppe ausgewählt werden, indem das Kontrollkästchen für den Gruppennamen aktiviert wird. Um die Auswahl aller Elemente wieder aufzuheben, deaktivieren Sie das Kontrollkästchen.
    • Ein Minuszeichen zeigt an, dass mindestens eines, aber nicht alle Elemente in einer Gruppe ausgewählt sind.
    • Es steht eine Suchfunktion zur Verfügung, um nach einer Komponente anhand ihres Namens zu filtern.
    • Die rechts neben dem Namen der Komponentengruppe aufgeführten Zahlen geben die Gesamtzahl der ausgewählten Komponenten in diesen Gruppen an, unabhängig vom Filter.

    Die Konfiguration wird pro Seitenkomponente definiert. Wenn untergeordnete Seiten dieselbe Vorlage und/oder Seitenkomponente verwenden (normalerweise ausgerichtet), wird dieselbe Konfiguration auf das zugehörige Absatzsystem angewendet.

    HINWEIS

    Adaptive Formularkomponenten sind für die Verwendung im Container für adaptive Formulare entwickelt, um das Forms-Ökosystem zu verwenden. Entsprechend dürfen diese Komponenten nur im Editor für adaptive Formulare verwendet werden und funktionieren nicht im Seiten-Editor von Sites.

    Einstellungen

    Auf der Registerkarte Einstellungen können Sie zusätzliche Optionen festlegen und beispielsweise für jede Komponente einen Anker zeichnen oder den Zellenabstand für die einzelnen Container definieren.

  6. Wählen Sie Fertig aus, um die Konfiguration zu speichern.

Konfigurieren des Entwurfs einer Komponente

  1. Wechseln Sie in den Design-Modus.

    screen_shot_2018-03-22at103113-1

  2. Tippen oder klicken Sie auf eine Komponente mit einem blauen Rahmen In diesem Beispiel wird eine Hero-Bildkomponente ausgewählt.

    screen_shot_2018-03-22at103434

  3. Öffnen Sie das Dialogfeld, indem Sie das Symbol Konfigurieren verwenden.

    Konfigurationssymbol

    Im Dialogfeld für den Entwurf können Sie die Komponente entsprechend den verfügbaren Designparametern konfigurieren.

    screen_shot_2018-03-22at103530

    Das Dialogfeld enthält drei Registerkarten:

    • Allgemein
    • Funktionen
    • Stile

    Eigenschaften

    Die Eigenschaften -Tab können Sie die wichtigen Design-Parameter der Komponente konfigurieren. Beispielsweise können Sie für eine Bildkomponente die maximal zulässige und minimale Größe des Bildes definieren.

    Funktionen

    Die Funktionen -Tab können Sie zusätzliche Funktionen der Komponente aktivieren oder deaktivieren. Beispielsweise können Sie für eine Bildkomponente die Ausrichtung des Bildes und die verfügbaren Zuschneideoptionen definieren und festlegen, ob ein Bild hochgeladen werden kann.

    Stile

    Die Stile -Tab können Sie die CSS-Klassen und -Stile definieren, die mit der Komponente verwendet werden sollen.

    screen_shot_2018-03-22at103741

    Mit der Schaltfläche Hinzufügen können Sie zusätzliche Einträge zu einer Dialogfeldliste mit mehreren Einträgen hinzufügen.

    Zusätzlichen Eintrag hinzufügen

    Verwenden Sie das Symbol Löschen, um einen Eintrag aus einer Dialogfeldliste mit mehreren Einträgen zu entfernen.

    Löschen

    Verwenden Sie das Symbol Verschieben, um in einer Dialogfeldliste mit mehreren Einträgen die Reihenfolge der Einträge zu ändern.

    Verschieben

  4. Klicken oder tippen Sie auf das Symbol Fertig, um Ihre Änderungen zu speichern und das Dialogfeld zu schließen.

Auf dieser Seite