Eine klare, vollständige und praxisnahe Erklärung der Breiten-Einstellungen (Inhaltsbreite, weite Breite / wide width, volle Breite / full width) in WordPress 6.8.3 mit dem Twenty Twenty-Five (2025) Block-Theme – sowohl global, als auch pro Seite/Block.

---

🧩 1. Grundprinzip: Wie WordPress Breiten im FSE regelt

In FSE-Themes wie Twenty Twenty-Five gibt es drei Ebenen, die Breiten definieren:

1. Globale Layout-Vorgaben (styles → layout)
   → bestimmen die maximale Inhaltsbreite des gesamten Themes.
2. Template / Template-Part Einstellungen
   → definieren Breiten für Bereiche wie Header, Footer oder einzelne Templatebereiche.
3. Block-Einstellungen pro Seite/Block
   → ermöglichen weite Breite (wide) oder volle Breite (full) Blockweise.

---

🟦 2. Globale Breiten (Site Editor → Stile → Layout)

Öffne:

Website-Editor (Editor) → Stile → Layout → Inhalt

Dort findest du u. a.:

✔ Inhaltsbreite (Content width)

• Dies ist die maximale Breite, die „normale“ Blöcke verwenden.
• Beispiel: 700–900 px (je nach Theme-Default)
• Sie wirkt auf:
  • normale Absätze, Bilder ohne „wide/full“
  • Listen, Buttons, Tabellen
  • alle inneren Layouts im Standardfluss

Wofür verwenden?
→ Für lesefreundliche Standardbreite deines Textes.

✔ Weite Breite (Wide width)

• Wird in Twenty Twenty-Five standardmäßig deutlich breiter als die Inhaltsbreite gesetzt.
• Beispiel: 1200–1400 px.
• Kann global angepasst werden.

Wofür verwenden?
→ Für Abschnitte, die etwas mehr Raum brauchen, aber nicht bis zum Monitorrand reichen sollen.
Beispiele:

• breite Überschriften
• große Bilder
• Cover-Blöcke mit mehr Luft
• Listen mit viel Weißraum

✔ Volle Breite / Full width

• Nutzt die volle Fensterbreite, 100 % von links bis rechts.
• Funktioniert nur bei Blöcken, die dies unterstützen (z. B. Cover, Gruppe, Spalten, Bilder).

Wofür verwenden?
→ Für hero sections, Farbflächen, Banner, große Layoutbereiche.

---

🟧 3. Template-Ebene (Editor → Templates oder Template-Parts)

Innerhalb eines Templates findest du oft Container wie:

• Gruppe (group)
• Zeile (row)
• Spalten (columns)

Diese können Breiten ebenfalls beeinflussen, weil sie selbst:

• standard
• wide
• full

sein können.

Beispiel:
Ein Template hat eine Gruppe mit „full width“, innen drin befindet sich eine Gruppe mit „content width“.

Dies ist exakt das Prinzip, das Twenty Twenty-Five verwendet:

Äußere Gruppe = volle Breite (Hintergrundfarben, Flächen)
Innere Gruppe = Inhaltsbreite (Text, content)

---

🟩 4. Pro-Seite / Pro-Block (Block-Toolbar)

Bei fast allen Layoutblöcken (Cover, Gruppe, Spalten, Bilder, Medien/Text) findest du oben in der Block-Toolbar:

• Normal (Standard Breite)
• Weit (Wide width)
• Volle Breite (Full width)

Wie anwenden?

Klicke z. B. auf einen Gruppenblock → oben auf die Symbole:

Symbol	Bedeutung
▭ Standard	folgt der Inhaltsbreite
↔ Breite	nutzt die globale wide width
⇔ Volle Breite	100% der Fensterbreite

---

🌐 5. Zentrale Einstellung im Theme JSON (global)

Twenty Twenty-Five definiert Breiten im theme.json, z. B.:

"layout": {
  "contentSize": "700px",
  "wideSize": "1200px"
}

Das ist die Basis für alle Breiten.

Auch wenn du nicht im Code arbeitest, steuert der Site Editor genau diese Werte.

---

✔ Best Practice für 2025 Theme (WordPress 6.8.3)

1) Für Texte immer Standardbreite verwenden

→ beste Lesbarkeit
→ responsive ohne Probleme

2) Für große Abschnitte Wide verwenden

Wenn du Luft brauchst, aber nicht das ganze Fenster füllen willst:

• große Überschriften
• Bilder
• einzeilige Statements

3) Für visuelle Abschnitte Full nutzen

Ideal für:

• Hero-Header
• Farbflächen
• Hintergründe, Cover, Banner
• Footer- oder Headerbereiche

Hinweis:
Bei voller Breite unbedingt eine Innengruppe in Inhaltsbreite verwenden, damit der Text nicht am Bildschirmrand klebt.

Wie im Theme integriert:

• Äußere Gruppe → volle Breite (Full)
• Innere Gruppe → Inhaltsbreite (Standard)

4) Global Inhalts- und Wide-Breite sauber einstellen

Empfehlung für moderne Screens:

• Inhaltsbreite: 720–800 px
• Wide-Breite: 1200–1400 px

Dies erreichst du unter:

Stile → Layout → Inhalt → Max. Breite einstellen

5) Keine Inline-Breiten benutzen

Nie manuell px-Breiten setzen → bricht oft das responsive Verhalten.

6) Für jede einzelne Seite denkbar einfach

• Abschnitte mit Text → Standard
• Abschnitte mit visueller Wirkung → Wide
• Hero / Hintergrundbereiche → Full

---

🎯 Beispiel-Layout einer guten Page-Struktur

Full width

(Full) Cover Blau → enthält
→ (Standard) Gruppe mit Text

Standard

Absatzbereich

Wide

Großes Bild oder Zitat

Full

Farbblock mit Bild oder CTA

Standard

Kontaktbereich

---

Wenn du möchtest, kann ich dir auch:

✅ eine Beispielseite in JSON für Twenty Twenty-Five erstellen
oder
✅ ein optimiertes Layout für deine Seite www.clipperton.at oder STT.at vorbereiten.

Möchtest du das?