T3Bootstrap 14 — Was ist neu?

Auf einen Blick

• Flux durch b13/container ersetzt
• Site Settings statt TypoScript-Konstanten
• Neues Inhaltselement: Zeitleiste (Timeline)
• Header-Buttons und Social-Media-Links jetzt mehrsprachig konfigurierbar
• Neues Header-Layout mit Inline-Meta-Navigation
• Überschrift optional im Textbereich bei horizontalen Layouts
• Vollständige deutsche Übersetzungen aller Labels
• Schönere einheitliche Icons

Von Flux zu b13/container

Die Extension flux-bs5-templates wurde durch container-bs5-templates ersetzt. Alle Container-Elemente (Spalten, Akkordeon, Tabs, Slideshow, Karten etc.) nutzen jetzt native TCA-Felder statt FlexForm-XML.

Vorteile:

• Direkte Datenbankfelder statt serialisiertes XML — performanter und durchsuchbar
• Standardmäßiges TYPO3-Formular-Handling ohne Flux-Abhängigkeit
• Einfachere Erweiterbarkeit über TCA-Overrides und Page TSconfig
• Mitgelieferte Migrationswizards für bestehende Inhalte

Spaltenbreiten als Prozent-Auswahl

Die sechs Breakpoint-Felder (XS bis XXL) für Spalten-Elemente sind keine Freitextfelder mehr. Redakteure wählen die Breite aus einem Dropdown mit prozentualen Angaben:

Auswahl	CSS-Klasse
25% (3/12)	col-md-3
33,33% (4/12)	col-md-4
50% (6/12)	col-md-6
100% (12/12)	col-md-12

Die Spaltenzahl ist über Page TSconfig konfigurierbar:

tx_t3bs.column.gridColumns = 16

Zusätzlich zeigen die Feld-Labels den Gerätekontext:

• Smartphone (XS, <576px) statt „XS“
• Tablet (MD, ≥768px) statt „MD“
• Desktop (LG, ≥992px) statt „LG“

Neues Inhaltselement: Zeitleiste

Ein neues Container-Element t3bs_timeline für chronologische Darstellungen. Jeder Eintrag hat ein Jahr/Datum-Feld und kann beliebige Inhalte enthalten.

CTA-Leiste: Von TypoScript zu Site Settings

Die gesamte Call-To-Action-Leiste (Social Media, Newsletter, E-Mail, Custom-Buttons) wird nicht mehr über TypoScript-Konstanten konfiguriert, sondern über strukturierte Site Settings mit eigenen Backend-Formularen.

Vorher (v13): ~600 Zeilen TypoScript-Konstanten mit manuellen Sprach-Conditions für de/fr/nl.

Nachher (v14): Ein CallToActionProcessor löst die Sprache automatisch auf. Die Konfiguration erfolgt komfortabel im Site-Settings-Editor mit Dropdown-Sprachauswahl.

Neue Settings-Typen

Typ	Verwendung
ctabaritemlist	CTA-Leisten-Einträge (Newsletter, E-Mail, Custom) mit Modal-Flag
ctabuttonlist	Header- und Footer-Buttons
calltoactionlist	Social-Media-Links

Jeder Eintrag unterstützt:

• Icon, Farbe, Sortierung
• Beliebig viele sprachspezifische Titel und Links
• Modal-Flag (für CTA-Leisten-Einträge)

Header-Buttons

Buttons im Header-Bereich (z.B. „Kontakt“) werden jetzt als farbige btn-Elemente neben dem Such-Button gerendert. Die Textfarbe wird automatisch per WCAG-2.x-Luminanz-Berechnung gewählt (weiß auf dunklem Hintergrund, schwarz auf hellem).

Die Konfiguration erfolgt über Site Settings mit sprachspezifischen Titeln und Links — ohne TypoScript.

Neues Header-Layout 5

„Logo links, Navigation + Meta-Links rechts“ — Die Meta-Navigation (Kontakt, Impressum, Sprachauswahl) wird nicht mehr als separate Zeile über dem Header angezeigt, sondern inline neben den Function-Buttons. Das ergibt einen kompakteren, einzeiligen Header.

Überschrift im Textbereich

Für textmedia– und textpic-Elemente mit horizontalem Grid-Layout gibt es eine neue Checkbox „Überschrift im Textbereich anzeigen“. Damit wird die Überschrift in die Text-Spalte verschoben statt über der gesamten Elementbreite angezeigt:

Standard:                          Mit Option:
┌──────────────────────────┐      ┌────────────┬─────────────┐
│ Überschrift              │      │ Überschrift│ Bild        │
├────────────┬─────────────┤      │ Text       │             │
│ Text       │ Bild        │      │            │             │
└────────────┴─────────────┘      └────────────┴─────────────┘

Vollständige Lokalisierung

Alle TCA-Feld-Labels in den Container-Elementen, der CTA-Leiste und den WapplerSystems-Extensions sind jetzt über XLIFF-Dateien lokalisiert — mit vollständigen deutschen Übersetzungen. Hardcodierte englische Labels wie „Cols XS“, „Gutter“, „Controls“ wurden durch sprechende, übersetzte Bezeichnungen ersetzt.

Kompatibilität

• TYPO3 14.0–14.3
• PHP 8.2+
• Bootstrap 5
• Fluid v4 (kein renderStatic(), kein templateVariableContainer)
• Kein $GLOBALS['TSFE'] — alle Zugriffe über Request-Attribute und Context API

Migration von v13

Für die Migration von Flux-basierten Inhalten stehen drei Upgrade-Wizards zur Verfügung:

1. MigrateFluxBs5ToContainerBs5 — Hauptmigration: FlexForm-Werte werden in native TCA-Felder überführt, Container-Beziehungen neu verdrahtet
2. MigrateWst3bootstrapToContainerBs5 — Legacy-Migration für ältere wst3bootstrap-Installationen
3. MigrateMegamenuToContainerItems — Megamenu-spezifische Migration

Die CTA-Leisten-Konfiguration muss manuell in den Site Settings neu angelegt werden, da die alten TypoScript-Konstanten nicht mehr ausgewertet werden.