Wix Hilfe-Center
    Start
  1. Studio, Partner von Wix & Enterprise
  2. Wix Studio
  3. Den Studio Editor verwenden
  4. Im Studio Editor Websites gestalten
    5. Studio Editor: Ein Abschnittsraster anpassen

Studio Editor: Ein Abschnittsraster anpassen

5 Min. Lesezeit
Im Studio Editor können Abschnitte über ein integriertes Raster verfügen, das eine einzelne Zelle enthält (in der der gesamte Abschnitt untergebracht ist). Teile den Abschnitt in weitere Zellen auf, um dem Inhalt eine responsive Struktur zu verleihen. Es stehen verschiedene anpassbare Layouts zur Auswahl.
In diesem Artikel erfährst du mehr über folgende Themen:
Möchtest du einem Container Zellen hinzufügen?

Einem Abschnitt Zellen hinzufügen

Füge Zellen zu einem Abschnitt hinzu, um ein responsives, strukturiertes Layout zu erstellen Durch die Unterbringung der Elemente in separaten Zellen wird sichergestellt, dass sie auf allen Bildschirmen an ihrem Platz bleiben. Wähle ein Layout und verschiebe die Elemente in die Zellen. Du kannst die Zellen jederzeit teilen oder später neue hinzufügen.

Um Zellen zu einem Abschnitt hinzuzufügen:

  1. Wähle den entsprechenden Abschnitt im Editor aus.
  2. Klicke oben im Abschnitt auf das Aufklappmenü Leer.
Screenshot der Symbolleiste, die sich mit dem Aufklappmenü mit den verfügbaren Layouts öffnet, wenn du einen Abschnitt auswählst
  1. Wähle ein Layout: Zeilen, Spalten, Collage, usw.
    Tipp: Du kannst das Layout jederzeit über das Aufklappmenü ändern. Deine Elemente werden dabei nicht verschoben.
  2. (Optional) Ziehe Elemente in die entsprechenden Zellen.

Zellen im Raster tauschen

Organisiere das Abschnittsraster schnell und effizient neu, indem du die Zellen tauschst. Per Drag-and-Drop kannst du sofort zwischen 2 Zellen wechseln — sie nehmen sofort gegenseitig ihren Platz im Raster ein.

Um Zellen zu tauschen:

  1. Wähle den entsprechenden Abschnitt im Editor aus.
  2. Wähle die erste Zelle aus.
  3. Halte das Symbol für Ziehen  am oberen Rand der Zelle, während du sie auf die andere Zelle ziehst.
    Tipp: Wenn du den Hinweis Content tauschen siehst, kannst du die Zelle loslassen.
Per Drag & Drop 2 Zellen im Abschnittsraster vertauschen

Das Abschnittsraster anpassen

Gestalte die Zellen und das Gitter so, wie du es möchtest. Du kannst vorhandene Zellen teilen oder zusammenführen, neue hinzufügen und die Rasterlinien ziehen, um ihre Größe anzupassen. Du kannst auch Gaps hinzufügen, um etwas Abstand zwischen den Zellen zu schaffen.

Um das Abschnittsraster anzupassen:

  1. Wähle den entsprechenden Abschnitt im Editor aus.
  2. Wähle, wie du das Raster anpassen möchtest:
Hinweis:
Zurzeit ist es nicht möglich, Zellen zu duplizieren.

Zu einem erweiterten CSS Grid wechseln

Wenn du zu einem erweiterte CSS Grid wechselst, hast du eine genauere Kontrolle über das Layout pro Breakpoint. Du kannst die Anzahl der Zeilen und Spalten auswählen, die du möchtest, und ihre Größe mithilfe von responsiven Maßeinheiten festlegen (z. B. fr, Min./Max., %).

Um vom Abschnittsraster zu einem CSS Grid zu wechseln:

  1. Wähle den entsprechenden Abschnitt im Editor aus.
  2. Klicke oben rechts im Editor auf den Pfeil Inspektor öffnen .
  3. Scrolle nach unten zu Layout.
  4. Klicke neben Erweitertes CSS Grid auf Wechseln.
  5. Klicke auf Zu CSS Grid wechseln.
Screenshot, der die Option zum Wechseln zum erweiterten CSS Grid im Inspektor-Panel zeigt

War das hilfreich?

|

In diesem Artikel

  • Einem Abschnitt Zellen hinzufügen
  • Zellen im Raster tauschen
  • Das Abschnittsraster anpassen
  • Zu einem erweiterten CSS Grid wechseln