Editor X: Das Ebenen-Panel verwenden

5 Min. Lesezeit
Editor X wird zu Wix Studio, unserer neuen Plattform für Agenturen und Freelancer.Mehr über Wix Studio erfahren
Verwalten die Ebenen deiner Seite über das Ebenen-Panel in der oberen Leiste des Editors. Es zeigt alle Elemente auf deiner Seite an und ermöglicht es dir, diese auszuwählen, ihre Reihenfolge zu ändern, sie auszublenden und mehr.
In diesem Artikel erfährst du mehr über folgende Themen:

Die Struktur des Ebenen-Panels

Im Ebenen-Panel werden alle Abschnitte in einer Hierarchie von oben nach unten auf der Seite angezeigt. Wenn die Seite eine Kopfzeile hat, wird diese oben in der Liste angezeigt, und eine Fußzeile würde entsprechend unten angezeigt.
Wenn du Elemente innerhalb anderer Elemente in deiner Seite verschachtelst, wird zwischen ihnen eine hierarchische Beziehung hergestellt, die von HTML und CSS abgeleitet ist. Zum Beispiel sind Textelemente innerhalb eines Containers diesem untergeordnet. Dieser Container ist wiederum dem Abschnitt untergeordnet, der ihn anzeigt. 
Das Ebenen-Panel ist nach dieser Logik dieses übergeordneten Modells organisiert, sodass du auf übergeordnete Elemente klicken kannst, um die darin enthaltenen untergeordneten Elemente zu sehen. Wenn deine Seite über globale Elemente verfügt, sind sie grün hervorgehoben.
Hinweis:
Container und Elemente in einem Abschnitt werden in der Z-Reihenfolge angezeigt. Das bedeutet, wenn ein Element ein anderes überlagert, wird es weiter oben in der Liste angezeigt. 
Das Ebenen-Panel zeigt die Elemente der ausgewählten Seite an. Um die Ebenen einer anderen Seite zu sehen, musst du die gewünschte Seite aus dem Aufklappmenü zur Seitennavigation auswählen:

Elemente im Ebenen-Panel auswählen

Das Ebenen-Panel ist eine nützliche und schnelle Möglichkeit, zu einem bestimmten Element auf deiner Seite zu navigieren. Es ist auch eine großartige Möglichkeit, ein Element zu finden, zum Beispiel wenn du überlagernde Elemente hast und du das Element, das du benötigst, nicht finden oder auswählen kannst.
Wenn du mit der Maus über eine Ebene fährst, wird sie auf der Seite hervorgehoben, damit du sie leicht finden kannst. Wenn du auf die Ebene klickst, scrollt der Editor direkt zu diesem Element. Auch wenn du das Panel zu diesem Zeitpunkt schließt, wird deine Auswahl gespeichert.
Tipp:
Wähle mehrere Elemente aus, indem du beim Anklicken die Umschalttaste gedrückt hältst.

Eine Ebene über das Panel verwalten

Hast du die gewünschte Ebene gefunden? In diesem Panel kannst du Aktionen wie das Kopieren der Ebene ausführen, sie im Panel nach oben oder unten verschieben, auswählen, auf welchen Seiten sie angezeigt werden soll, und vieles mehr.
Verwalte eine Ebene mit den folgenden Optionen:
  • Klicke mit der rechten Maustaste auf den Namen der Ebene.
  • Fahre mit der Maus über den Namen der Ebene und klicke auf das Symbol für Mehr anzeigen .
Mit sich überlagernden Elementen arbeiten?
Du kannst direkt auf der Arbeitsfläche zwischen den verschiedenen Ebenen navigieren. Klicke mit der rechten Maustaste auf das Element, das das benötigte Element abdeckt, und klicke dann auf Ebene auswählen, um darauf zuzugreifen.

Elemente im Ebenen-Panel umbenennen

Wenn du mehrere Abschnitte, Container und Elemente zu deiner Seite hinzufügst, kann es schwierig werden, sie im Ebenen-Panel zu unterscheiden. Du kannst die Ebenen ganz einfach umbenennen, damit sie leicht zu erkennen sind - doppelklicke auf die entsprechende Ebene und gib ihr im Textfeld einen neuen Namen.
Du verwendest den Dev-Modus?
Zeige Element-IDs im Ebenen-Panel an, um Elemente in deinem Code leicht zu identifizieren. Aktiviere die Option ID-Kennung anzeigen, um die IDs wie im Properties-Panel definiert anzuzeigen.

Elemente im Ebenen-Panel neu anordnen

Verwende das Ebenen-Panel, um die Elemente innerhalb desselben übergeordneten Containers einfach neu anzuordnen, indem du sie in der Liste nach oben oder unten ziehst.
Wenn du die Reihenfolge der Elemente änderst, wird die Z-Reihenfolge geändert. Wenn du zum Beispiel möchtest, dass Text über einer Form erscheint, muss sich der Text im Ebenen-Panel über der Form befinden. 

Um Elemente im Ebenen-Panel neu anzuordnen:

  1. Klicke oben im Editor X auf Ebenen .
  2. Klicke auf den Container mit den Elementen, die du neu anordnen möchtest.
  3. Klicke und ziehe die entsprechenden Elemente an die gewünschte Position.

Elemente im Ebenen-Panel einblenden

Jedes Element auf deiner Website kann über das Rechtsklick-Menü ausgeblendet werden. Um jedoch ein Element wieder einzublenden, musst du dies über das Ebenen-Panel tun.
Ein ausgeblendetes Element wird im Ebenen-Panel mit dem Symbol für Ausgeblendet  angezeigt.

Um das Element im Ebenen-Panel wieder einzublenden:

  1. Klicke oben im Editor X auf Ebenen .
  2. Suche das ausgeblendete Element in der Liste.
  3. Fahre mit der Maus über das Element und klicke auf das Symbol für Weitere Aktionen .
  4. Klicke auf Anzeigen.
Tipp:
Wenn du ein Element zu einem kleineren Breakpoint hinzufügst (z. B. Mobile), wird es an größeren Breakpoints (z. B. Tablet) immer ausgeblendet. Wenn du die obigen Schritte befolgst, kannst du das Element auch an anderen Breakpoints anzeigen lassen. 

War das hilfreich?

|