Anleitungen/Inhalte erstellen/Design/Anpassen des Gruppenlayouts

Anpassen des Gruppenlayouts

Gruppenblöcke helfen dir dabei, Inhalte in einem Container zu organisieren, den du als Einheit formatieren und positionieren kannst. Dieser Ratgeber zeigt dir, wie du anhand der Layout-Einstellungen responsive, optimal angeordnete Seitenabschnitte mit einem Gruppenblockerstellen kannst.

Video-Tutorial

Anordnen von Blöcken innerhalb einer Gruppe

Standardmäßig ordnet ein Gruppenblock die Blöcke so an, dass sie übereinander angezeigt werden. Durch Ändern der Anordnung von Blöcken in einer Gruppe kannst du steuern, ob Inhalte nebeneinander (horizontal) oder gestapelt (vertikal) angezeigt werden, was dir mehr Layout-Flexibilität für dein Design bietet. Du kannst die Ausrichtung des Inhalts in der Gruppe anpassen:

  1. Wähle oben auf dem Bearbeitungsbildschirm Listenansicht aus.
  2. Wähle den Gruppenblockaus.
  3. Wähle in der Seitenleiste mit den Blockeinstellungen auf der rechten Seite eine dieser Optionen aus:
    • Gruppe: die Standardanordnung für Gruppenblöcke.
    • Stapel: ordnet Blöcke vertikal übereinander an. Ideal zum Erstellen klarer, aufeinander folgender Inhalte wie Schritte oder hervorgehobene Elemente.
      • Ändere unter Ausrichtungdie vertikale Ausrichtung mit Optionen wie „Oben“, „Zentriert“ oder „Unten“.
    • Zeile: platziert Blöcke horizontal nebeneinander. Perfekt zum Erstellen von Funktionsvergleichen oder Bildergalerien.
      • Passe unter Ausrichtungdie horizontale Ausrichtung mit Optionen wie „Links“, „Zentriert“, „Rechts“ oder „Zwischenraum“ an.
    • Raster: organisiert Blöcke in einem anpassbaren Rasterlayout. Nützlich für Produktanzeigen oder Teammitglieder.
  4. Klicke auf „Speichern“ oder „Veröffentlichen“ , um deine Änderungen zu speichern.

Ändern der Breite des Gruppenblocks

Das Einstellen der Gesamtbreite deines Gruppenblocks hilft dir, eine visuelle Hierarchie auf deiner Seite zu erstellen und zu steuern, wie Inhalte an unterschiedliche Bildschirmgrößen angepasst werden. So kannst du ändern, wie viel Platz der Gruppenblock einnimmt, von Inhaltsbreite über weite Breite bis hin zur vollen Breite:

  1. Wähle oben auf dem Bearbeitungsbildschirm Listenansicht aus.
  2. Wähle den Gruppenblockaus.
  3. Klicke in der Toolbar, die dann angezeigt wird, auf das Icon „Ausrichten“ und wähle aus folgenden Optionen aus:
    • Inhalt (oder „Keine“): legt die Breite von Blöcken auf die Standardbreite des Inhaltsbereichsfest. Ideal für normale Inhaltsabschnitte.
    • Weite Breite: Die Breite von Blöcken wird auf eine breitere (aber nicht die volle) Breite festgelegt. Diese Option ist gut geeignet, um auf wichtige Inhalte aufmerksam zu machen, ohne den gesamten Bildschirm zu beanspruchen.
    • Volle Breite: Der Block füllt die gesamte Breite des verfügbaren Bereichs aus. Perfekt, um immersive Inhaltsabschnitte wie Banner oder große Bildergalerien zu erstellen.
  4. Klicke auf „Speichern“ oder „Veröffentlichen“ , um deine Änderungen zu speichern.
An arrow pointing to the "Align" icon in the Group block toolbar, with the block set to "wide width".

Weitere Informationen zum Ändern der Breite deiner Inhalte.

Anpassen der Breite des Inhalts in einer Gruppe

Du kannst steuern, wie viel Platz deine Inhalte in einer Gruppe einnehmen. Das ist hilfreich, wenn du responsive Designs erstellst, die sowohl auf Mobil- als auch auf Desktop-Bildschirmen gut aussehen. Befolge diese Schritte, um die Breiteneinstellungen von Inhalten in deinem Gruppenblock zu ändern:

  1. Wähle oben auf dem Bearbeitungsbildschirm Listenansicht aus.
  2. Wähle den Gruppenblockaus.
  3. Suche in der Seitenleiste mit den Blockeinstellungenden Abschnitt „Innere Blöcke“. Schalte die Einstellung „Die inneren Blöcke verwenden die Breite des Inhalts“ um:
    • Ein: Inhalt folgt den Einstellungen für die Inhaltsbreite der Website. Alternativ kannst du auch bestimmte Breitenwerte mithilfe der Steuerelemente für die Breite anpassen.
    • Aus: Der Inhalt wird so erweitert, dass er die gesamte Gruppenblockbreite ausfüllt.
  4. Klicke auf „Speichern“ oder „Veröffentlichen“ , um deine Änderungen zu speichern.

Über „Die inneren Blöcke verwenden die Breite des Inhalts“

Die Einstellung „Die inneren Blöcke verwenden die Breite des Inhalts“ legt fest, wie breit der Inhalt in deinem Gruppenblock angezeigt wird:

Wenn Ein: Der Inhalt in deinem Gruppenblock folgt der globalen Einstellung deiner Website für die Inhaltsbreite (normalerweise etwa 700–800 px breit). Dadurch wird eine geschlossene, zentrierte Spalte mit Inhalten erstellt, selbst wenn dein Gruppenblock die gesamte Breite der Seite einnimmt. Dadurch wird die Lesbarkeit auf größeren Bildschirmen verbessert und gleichzeitig ein ansprechendes Layout beibehalten.

Wenn Aus: Der Inhalt in deinem Gruppenblock wird auf die gesamte Breite des Gruppenblocks selbst erweitert. Wenn dein Gruppenblock die volle Breite aufweist, werden deine Inhalte ebenfalls über die gesamte Breite angezeigt. Dies ist nützlich, um randlose Designs wie Bildergalerien in voller Breite zu erstellen oder wenn der Inhalt der Breite des Hintergrunds deines Gruppenblocks entsprechen soll.

Ein praktisches Beispiel: Wenn du einen Gruppenblock mit einem farbigen Hintergrund hast, der sich über die gesamte Seitenbreite erstreckt, würde durch Aktivieren von „Innere Blöcke verwenden die Breite des Inhalte“ eine zentrierte Spalte mit Inhalt erstellt werden, wobei sich der farbige Hintergrund von Rand zu Rand erstreckt – perfekt, um wichtige Informationen auf visuell interessante Weise hervorzuheben.

Anpassen von Abmessungen

Mithilfe von Abmessungseinstellungen kannst du die Höhe, Breite und den Abstand deines Gruppenblocks entsprechend deinen Anforderungen an Inhalte und Layout anpassen. Dadurch kannst du visuell ausgewogene Abschnitte erstellen und deinen Inhalten mehr Platz geben. So legst du genaue Abstände um die Inhalte deines Gruppenblocks fest:

  1. Wähle oben auf dem Bearbeitungsbildschirm Listenansicht aus.
  2. Wähle den Gruppenblockaus.
  3. Suche in der Seitenleiste mit den Blockeinstellungenden Abschnitt Abmessungen .
  4. Lege Werte fest für:
    • Innenabstand: Abstand zwischen Inhalt und Gruppenblockrahmen. Mehr Innenabstand schafft mehr Platz um deine Inhalte.
    • Außenabstand: Abstand um die Außenseite des Gruppenblocks. Hilft dabei, diesen Abschnitt von anderen Inhalten zu trennen.
  5. Benutze das Link-Icon, um zwischen einheitlichen oder individuellen Seitenanpassungen zu wechseln.
The padding of the Group block highlighted, and an arrow pointing to the dimensions settings.

Weitere Informationen über das Anpassen von Blockabmessungen.

Festlegen des Blockabstands

Durch Anpassen dieses Abstands kannst du festlegen, wie nah oder weit auseinander liegend Inhalte in deinem Gruppenblockangezeigt werden, um die richtige visuelle Beziehung zwischen Elementen zu schaffen. Dies hilft Besuchern, verwandte Inhalte zu unterscheiden, und schafft gleichzeitig einen zusammenhängenden Abschnitt. Lege den Abstand zwischen Blöcken in deiner Gruppe fest:

  1. Wähle oben auf dem Bearbeitungsbildschirm Listenansicht aus.
  2. Wähle den Gruppenblockaus.
  3. Suche in der Seitenleiste mit den Blockeinstellungenden Abschnitt Blockabstand .
  4. Verwende die Steuerelemente, um Folgendes festzulegen:
    • Blockabstand: Abstand zwischen einzelnen Blöcken. Mehr Abstand sorgt für eine klare Trennung, während weniger Abstand den Eindruck einer größeren Zusammengehörigkeit der Inhalte vermittelt.
    • Mindesthöhe: wie hoch der Gruppenblock mindestens sein sollte. Nützlich zum Erstellen konsistenter Abschnitte oder zum Hinzufügen von Abständen für eine ausgewogene Darstellung.

Weitere Informationen über das Anpassen des Abstands zwischen Blöcken.

Copied to clipboard!