Ausrichtung der Elemente für das Styling: Ebenen der Anpassung

Genauso wie mit der Anordnung und Konfiguration von Blocks im Grid Mode, verknüpft die Layout Vererbung von Ihnen ausgewählte Styles im Design Mode. Sie können die Styles jedes Layouts verändern und diese
Änderungen mit allen Tochter Layouts verknüpfen – bis Sie die Tochter Layouts auch verändern, natürlich.
Übersetzung zur Grafik:Levels der Style Veränderung

  1. Hauptelement

– Styles werden global verknüpft – aber nicht mit anderen Layouts verbunden.

– Können mit Veränderungen von speziellen Layouts oder Instances überschrieben werden.

  1. Aktuelles Layout

– Gilt nur für das gerade bearbeitete Layout mit seinen Tochter Layouts.

– Kann mit Veränderungen von Instances überschrieben werden.

  1. Instance

– Gilt für eine spezielle Layout-Block-Element Kombination miteinander.

– Speziellste Art von Veränderung.

– Kann nur von Live CSS Änderungen oder Tochter Theme CSS überschrieben werden.

  • State

– Gilt für Hyperlink-Elemente.

– Kann in jedem der oberen Levels der Änderungen gestylt werden (es handelt sich hierbei selbst nicht um ein Anpassungslevel).

 

Für die meisten Elemente können Sie auswählen, wie weit oder weniger weit Ihre Änderungen gelten. Dieser Unterbereich behandelt die Level der Änderungen von allgemein zu sehr speziell.

Sie können ein Element oder einen Block zum Stylen von 1) allen Layouts (bezieht sich auf das Bearbeiten des „Regular Elements“), 2) einem bestimmten Layout oder 3) einer Instance: ein einzelnes Element oder ein Block in einem bestimmten Layout. Des Weiteren können Sie für Link Elemente individuelle States ändern. Wählen Sie ein Element oder einen Block entweder in der Übersicht oder im Design aus (beide Methoden werden in diesem Artikel beschrieben).

Sobald Sie ein Element oder einen Block ausgewählt haben, verbinden Sie die Styles in der Menüleiste.

Beispiel: Sie entscheiden sich, Style Änderungen am Kopfzeilenblock der Seite vorzunehmen, nicht aber an den Beiträgen. Sie ändern also die Styles des Kopfzeilenblocks nur für das Single > Page Layout.

Die Layout Vererbung betrifft alle Style Änderungen. Selbst wenn Sie einen Style nur für ein bestimmtes Layout oder eine bestimmte Instance definieren, werden alle unveränderten Tochter Layouts diese Änderungen übernehmen, da immer das gesamte Layout vererbt wird.

Beachten Sie: Das Spiegeln von Blocks funktioniert anders als die Funktionsweise von Instances. Wenn Sie eine Instance eines Elements in einem Layout A verändern und dann den Inhaltsblock in Layout B spiegeln, gelten diese Styles auch für alle Elemente des Layouts B. Mit anderen Worten, auch wenn Sie die Styles so eingestellt haben, dass Sie nur in einem Element in einem Layout gelten, werden Sie dennoch in einem zweiten Layout auftauchen, wenn Sie spiegeln.

Level 1: Bearbeiten des Regular Elements

Die allgemeinsten Veränderungen für das Regular Element betreffen alle Layouts – mit anderen Worten Ihre gesamte Website. Wenn Sie Styles für den Kopfzeilenblock des Regular Elements bearbeiten, sagen Sie beispielsweise, dass Ihre Änderungen für alle Kopfzeilenblöcke Ihrer gesamten Seite gelten sollen.

Design Editor Methode:

  1. Vergrößern Sie den Bereich des Verzeichnisbaums, der die Elemente enthält, die Sie verändern möchten.
  2. Klicken Sie auf das Element oder den Block, den Sie verändern möchten.

Übersichts Methode:

  1. Fahren Sie mit der Maus über ein Element in der Übersicht. Vergewissern Sie sich, dass die Struktur Quickinfo das Element oder den Block anzeigt, den Sie verändern möchten (wie beispielsweise Blocks > Navigation > Meine Pseudonyme).
  2. Klicken Sie mit Rechts auf das Element.
  3. Gehen Sie zu Regular Element und klicken auf Edit.

Level 2: Bearbeiten dieses Layouts

Das nächste Level von Veränderungen bezieht sich auf bestimmte Layouts – normalerweise das Layout, an dem Sie gerade arbeiten. Verändern Sie ein Element des aktuellen Layouts, wenn das Element in diesem Layout sich von anderen Layouts unterscheiden soll.

Design Editor Methode:

  1. Vergrößern Sie den Bereich des Verzeichnisbaums, der das Element, das Sie verändern möchten, enthält.
  2. Klicken Sie auf das Element oder den Block, den Sie verändern möchten.
  3. Klicken Sie auf den Customize for Current Layout Button neben dem Element oder in dem Editor.

Übersichts Methode:

  1. Fahren Sie mit der Maus in der Übersicht über das Element. Vergewissern Sie sich, dass die Struktur Quickinfo das Element oder den Block anzeigt, den Sie verändern möchten (wie beispielsweise Blocks > Navigation > Meine Pseudonyme).
  2. Klicken Sie mit Rechts auf das Element.
  3. Gehen Sie zu Regular Element und klicken auf Edit For This Layout.

Level 3: Verändern einer Instance

Eine Instance eines Elements ist eine bestimmte Layout-Element Kombination – beispielsweise der Kopfzeilenblock mit der ID von 9 im Single Layout. Wenn Sie mehrere Blocks oder Elemente desselben Typs in einem Layout haben und ein ausgewähltes Style nur einem von ihnen zuordnen möchten, richten Sie die Instance aus.

Instances sind nicht so kompliziert wie das Auswählen eines Menüsymbols aus einem bestimmten Navigationsblock. Wenn Sie zwei Navigationsblocks in einem Layout haben, erlaubt Ihnen das Verwenden von Instances Menü Symbol Elemente zu nur einem der Menüs zu führen, anstatt es zu allen Menü Symbolen des Layouts führen.

Beispiel: Stellen Sie sich vor, Sie haben zwei Widget Areas in Ihrem Layout und Sie wollen nur die Styles des Titel von einem der Widget Areas im Single Layout verändern. Style Änderungen am Titel an nur einem der Widget Areas vorzunehmen, müssen Sie die Instances anordnen (das Layout, den Block, eine Elementkombination). Andererseits, wenn Sie das Widget Titel Element für das gesamte Layout anordnen, würden Ihre Änderungen nur in den Titeln der beiden Widget Areas erscheinen.

Beachten Sie: Das Spiegeln von Blocks Das Spiegeln von Blocks funktioniert anders als die Funktionsweise von Instances. Wenn Sie eine Instance eines Elements in einem Layout A verändern und dann den Inhaltsblock in Layout B spiegeln, gelten diese Styles auch für alle Elemente des Layouts B. Mit anderen Worten, auch wenn Sie die Styles so eingestellt haben, dass Sie nur in einem Element in einem Layout gelten, werden Sie dennoch in einem zweiten Layout auftauchen, wenn Sie spiegeln.Design Editor Methode:

  1. Klicken Sie auf den Show Instances Filter, wenn er nicht ausgewählt ist.
  2. Vergrößern Sie den Structure oder Blocks Bereich des Verzeichnisbaums.
  3. Finden Sie das Element oder den Block, den Sie stylen möchten und vergrößern Sie den Instances Unterbereich.
  4. Klicken Sie auf den Status, den Sie verändern möchten.

Übersichts Methode:

  1. Fahren Sie mit der Maus über das Element in der Übersicht. Vergewissern Sie sich, dass das richtige Element oder der richtige Block, den Sie anpassen möchten, in der Struktur Quickinfo angezeigt wird (wie beispielsweise Blocks > Navigation > Meine Pseudonyme).
  2. Klicken Sie mit Rechts auf das Element.
  3. Klicken Sie auf Edit This Instance.

Bearbeiten von Hyperlink States

Die verschiedenen Link States (visited, hover, active) können auf ähnliche Weise verändert werden wie Elemente, mit Ausnahme von Bearbeitungen für ein bestimmtes Layout. Die Option einen Status auszuwählen erscheint, wenn Sie ein Link Element wie „Hyperlink“ oder „Menu Item“ ausgewählt haben.

Bearbeiten des Status für alle Layouts

Design Editor Methode:

  1. Klicken Sie auf den Show States Button, wenn dieser nicht ausgewählt ist.
  2. Vergrößern Sie den Blocks Bereich des Verzeichnisbaums.
  3. Finden Sie das Tochter Element, das Sie stylen möchten und vergrößern Sie den States Unterbereich.
  4. Klicken Sie auf den Status, den Sie verändern möchten.

Übersichts Methode:

  1. Fahren Sie mit der Maus über das Element in der Übersicht. Vergewissern Sie sich, dass das richtige Element oder der richtige Block, den Sie anpassen möchten, in der Struktur Quickinfo angezeigt wird (wie beispielsweise Blocks > Navigation > Meine Pseudonyme).
  2. Klicken Sie mit Rechts auf das Element.
  3. Gehen Sie zu Regular Element ► States und klicken Sie auf den Status, den Sie verändern möchten.

Bearbeiten eines Status für eine Instance

Design Editor Methode:

  1. Klicken Sie auf die Show Instances und Show States Buttons, wenn diese nicht ausgewählt sind.
  2. Vergrößern Sie den Blocks Bereich des Verzeichnisbaums.
  3. Finden Sie das Tochterelement, das Sie stylen möchten und vergrößern Sie den Instances Unterbereich.
  4. Klicken Sie unter den anwendbaren Instances auf den Status, den Sie verändern möchten.

Übersichts Methode:

  1. Fahren Sie mit der Maus über das Element in der Übersicht. Vergewissern Sie sich, dass das richtige Element oder der richtige Block, den Sie anpassen möchten, in der Struktur Quickinfo angezeigt wird (wie beispielsweise Blocks > Navigation > Meine Pseudonyme).
  2. Klicken Sie mit Rechs auf das Element.
  3. Klicken Sie auf Instance States und klicken Sie dann den Status an, den Sie verändern möchten.

Dieser Artikel wurde zuletzt für die Headway Version 3.7.2 aktualisiert.

Letzte Aktualisierung am 21.06.2014