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

7 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.
Öffne unsere Wix Studio Academy, um zusätzliche Webinare, Anleitungen und Kurse von Wix Studio anzusehen.
In diesem Artikel erfährst du mehr über folgende Themen:

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.
Möchtest du einem Container Zellen hinzufügen?

Um Zellen zu einem Abschnitt hinzuzufügen:

  1. Wähle den entsprechenden Abschnitt 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. Ziehe Elemente in die entsprechenden Zellen.
Screenshot eines leeren Abschnitts im Studio Editor, direkt nachdem du das Collagen-Layout angewendet hast, in dem die neuen Zellen hervorgehoben sind
Überlagern sich deine Rasterzellen auf Mobilgeräten?
Wir empfehlen, zu einem vertikalen Layout (z. B. Zeilen) zu wechseln, um dieses Problem zu beheben.

Das Abschnittsraster anpassen

Gestalte 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 aus.
  2. Wähle, wie du das Raster anpassen möchtest:
Hinweis:
Zurzeit ist es nicht möglich, Zellen zu duplizieren.

Zellen im Raster tauschen und spiegeln

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.
Alternativ kannst du das gesamte Raster horizontal oder vertikal spiegeln, um verschiedene Optionen zur Präsentation des Inhalts deines Kunden zu sehen.

Um Zellen zu tauschen:

  1. Wähle den entsprechenden Abschnitt aus.
  2. Wähle aus, was du als Nächstes tun möchtest:

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 aus.
  2. Klicke oben rechts im Editor auf das Symbol für 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
  • Das Abschnittsraster anpassen
  • Zellen im Raster tauschen und spiegeln
  • Zu einem erweiterten CSS Grid wechseln