Seminar TYPO3 v14: Sitepackages, Site Sets und Frontend-Integration

Das Seminar entwickelt ein wartbares Sitepackage für TYPO3 v14. Konfiguration, Site Sets, Templates, Assets und wiederverwendbare Komponenten werden so organisiert, dass mehrere Websites und spätere Updates ohne verstreute Einzelkonfiguration beherrschbar bleiben.

Die Inhalte sind auf einzelseminar mit hohem Praxisanteil ausgelegt. Theorie, Demonstration, geführte Konfiguration und kontrollierte Übungen greifen unmittelbar ineinander.

Lernziele

• Sitepackages als versionierte TYPO3-Pakete strukturieren
• Site Sets, Settings und TypoScript-Provider korrekt einsetzen
• Fluid-Layouts, Partials und Komponenten sauber integrieren
• Menüs, Inhalte und Medien kontrolliert aufbereiten
• Mehrfachnutzung, Deployment und Upgradefähigkeit sicherstellen

Inhaltsübersicht

1. Paketstruktur und Verantwortungsgrenzen
2. Site Sets und Abhängigkeiten
3. Settings und konfigurierbare Werte
4. TypoScript-Provider und Seitenobjekt
5. Fluid-Layouts und Komponenten
6. Assets und Frontend-Build
7. Menüs, Daten und Medien
8. Mehrere Sites und Wiederverwendung
9. Tests, Deployment und Upgradefähigkeit

Kapitel 1: Paketstruktur und Verantwortungsgrenzen

Inhaltsübersicht des Kapitels

• Sitepackage fachlich abgrenzen
• Composer-Integration aufbauen
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Sitepackage fachlich abgrenzen, Composer-Integration aufbauen. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 1.1: Sitepackage fachlich abgrenzen

Fachliche Ausarbeitung: Design, Konfiguration, Templates, Assets und projektspezifische Erweiterungen als zusammengehörige Paketverantwortung definiert. Praktische Umsetzung: Eine Zielstruktur mit klaren Ordnern und Namensregeln erstellt. Die entstandene Lösung wird mit einer Checkliste geprüft und bei Abweichungen gezielt korrigiert.

Schritt 1.2: Composer-Integration aufbauen

Fachliche Ausarbeitung: Paketmetadaten, Autoloading, Abhängigkeiten und lokale Pfad-Repositories konsistent eingerichtet. Praktische Umsetzung: Das Sitepackage installierbar und versionskontrolliert eingebunden. Ein definierter Kontrollpunkt gleicht Konfiguration, Funktion und redaktionelle Wirkung miteinander ab.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 2: Site Sets und Abhängigkeiten

Inhaltsübersicht des Kapitels

• Site Set definieren
• Sets sinnvoll kombinieren
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Site Set definieren, Sets sinnvoll kombinieren. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 2.1: Site Set definieren

Fachliche Ausarbeitung: Name, Label, Abhängigkeiten und bereitgestellte Konfiguration als wiederverwendbares Set beschrieben. Praktische Umsetzung: Ein Site Set im Paket angelegt und einer Site zugewiesen. Ein definierter Kontrollpunkt gleicht Konfiguration, Funktion und redaktionelle Wirkung miteinander ab.

Schritt 2.2: Sets sinnvoll kombinieren

Fachliche Ausarbeitung: Core-Sets, projektspezifische Sets und optionale Funktionssets nach Verantwortlichkeit geordnet. Praktische Umsetzung: Eine nachvollziehbare Set-Kette ohne doppelte Konfiguration aufgebaut. Die Arbeitsschritte werden nachvollziehbar dokumentiert und anhand eines fachlichen Prüfkriteriums kontrolliert.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 3: Settings und konfigurierbare Werte

Inhaltsübersicht des Kapitels

• Settings fachlich modellieren
• Werte in TypoScript und Fluid nutzen
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Settings fachlich modellieren, Werte in TypoScript und Fluid nutzen. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 3.1: Settings fachlich modellieren

Fachliche Ausarbeitung: Farben, Abstände, Logos, Pfade und funktionale Optionen nach Änderbarkeit und Datentyp bewertet. Praktische Umsetzung: Eine settings.definitions-Struktur mit Beschreibungen und Defaults erstellt. Die Arbeitsschritte werden nachvollziehbar dokumentiert und anhand eines fachlichen Prüfkriteriums kontrolliert.

Schritt 3.2: Werte in TypoScript und Fluid nutzen

Fachliche Ausarbeitung: Site-Settings an zentraler Stelle gelesen und in Rendering sowie Templates übergeben. Praktische Umsetzung: Mehrere darstellungsrelevante Werte ohne hart codierte Duplikate verwendet. Abschließend erfolgt eine Prüfung auf Konsistenz, Wartbarkeit und sichere Wiederholbarkeit.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 4: TypoScript-Provider und Seitenobjekt

Inhaltsübersicht des Kapitels

• Konfiguration modular einbinden
• Seitenrendering aufbauen
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Konfiguration modular einbinden, Seitenrendering aufbauen. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 4.1: Konfiguration modular einbinden

Fachliche Ausarbeitung: Setup, Konstanten, Imports und dateibasierte Teilkonfiguration nach Aufgabe getrennt. Praktische Umsetzung: Ein übersichtliches TypoScript-Grundgerüst im Site Set erstellt. Abschließend erfolgt eine Prüfung auf Konsistenz, Wartbarkeit und sichere Wiederholbarkeit.

Schritt 4.2: Seitenrendering aufbauen

Fachliche Ausarbeitung: PAGE, FLUIDTEMPLATE, Metadaten, Assets und Standardinhalte kontrolliert zusammengesetzt. Praktische Umsetzung: Eine vollständige Seitenhülle mit klaren Datenübergaben gerendert. Die entstandene Lösung wird mit einer Checkliste geprüft und bei Abweichungen gezielt korrigiert.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 5: Fluid-Layouts und Komponenten

Inhaltsübersicht des Kapitels

• Layoutstruktur umsetzen
• Varianten wartbar gestalten
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Layoutstruktur umsetzen, Varianten wartbar gestalten. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 5.1: Layoutstruktur umsetzen

Fachliche Ausarbeitung: Globale Seitenbereiche, Templates, Partials und Komponenten aus dem Frontend-Konzept abgeleitet. Praktische Umsetzung: Header, Navigation, Hauptbereich und Footer modular aufgebaut. Die entstandene Lösung wird mit einer Checkliste geprüft und bei Abweichungen gezielt korrigiert.

Schritt 5.2: Varianten wartbar gestalten

Fachliche Ausarbeitung: Seitentypen, Layoutoptionen und optionale Bereiche ohne Kopien ganzer Templates umgesetzt. Praktische Umsetzung: Mehrere Seitenlayouts aus einer gemeinsamen Basis gerendert. Ein definierter Kontrollpunkt gleicht Konfiguration, Funktion und redaktionelle Wirkung miteinander ab.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 6: Assets und Frontend-Build

Inhaltsübersicht des Kapitels

• CSS und JavaScript organisieren
• Assets kontrolliert einbinden
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt CSS und JavaScript organisieren, Assets kontrolliert einbinden. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 6.1: CSS und JavaScript organisieren

Fachliche Ausarbeitung: Quellcode, gebaute Dateien, Abhängigkeiten und Einbindereihenfolge getrennt verwaltet. Praktische Umsetzung: Eine reproduzierbare Asset-Struktur mit eindeutigen Zielpfaden erstellt. Ein definierter Kontrollpunkt gleicht Konfiguration, Funktion und redaktionelle Wirkung miteinander ab.

Schritt 6.2: Assets kontrolliert einbinden

Fachliche Ausarbeitung: Priorität, asynchrones Laden, Integrität, Cache-Busting und bedingte Einbindung bewertet. Praktische Umsetzung: Nur tatsächlich benötigte Assets je Seitentyp ausgeliefert. Die Arbeitsschritte werden nachvollziehbar dokumentiert und anhand eines fachlichen Prüfkriteriums kontrolliert.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 7: Menüs, Daten und Medien

Inhaltsübersicht des Kapitels

• Navigation mit Data Processors erzeugen
• Inhalte und Medien aufbereiten
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Navigation mit Data Processors erzeugen, Inhalte und Medien aufbereiten. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 7.1: Navigation mit Data Processors erzeugen

Fachliche Ausarbeitung: Menüebenen, aktive Zustände, Sonderseiten und Sprachkontext vorbereitet. Praktische Umsetzung: Eine zugängliche Haupt- und Untermenünavigation mit Fluid umgesetzt. Die Arbeitsschritte werden nachvollziehbar dokumentiert und anhand eines fachlichen Prüfkriteriums kontrolliert.

Schritt 7.2: Inhalte und Medien aufbereiten

Fachliche Ausarbeitung: ContentObject-, Files- und weitere Data Processors für klare Template-Daten kombiniert. Praktische Umsetzung: Einen Medien- und Inhaltsbereich ohne Datenbanklogik im Template gerendert. Abschließend erfolgt eine Prüfung auf Konsistenz, Wartbarkeit und sichere Wiederholbarkeit.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 8: Mehrere Sites und Wiederverwendung

Inhaltsübersicht des Kapitels

• Gemeinsame und lokale Konfiguration trennen
• Überschreibungen kontrollieren
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Gemeinsame und lokale Konfiguration trennen, Überschreibungen kontrollieren. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 8.1: Gemeinsame und lokale Konfiguration trennen

Fachliche Ausarbeitung: Designsystem, Mandantenwerte und site-spezifische Abweichungen auf geeignete Sets verteilt. Praktische Umsetzung: Zwei Sites mit gemeinsamer Basis und getrennten Einstellungen aufgebaut. Abschließend erfolgt eine Prüfung auf Konsistenz, Wartbarkeit und sichere Wiederholbarkeit.

Schritt 8.2: Überschreibungen kontrollieren

Fachliche Ausarbeitung: Reihenfolge, Abhängigkeiten und dokumentierte Erweiterungspunkte für projektspezifische Anpassungen festgelegt. Praktische Umsetzung: Eine lokale Variante ohne Änderung der gemeinsamen Basis umgesetzt. Die entstandene Lösung wird mit einer Checkliste geprüft und bei Abweichungen gezielt korrigiert.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Kapitel 9: Tests, Deployment und Upgradefähigkeit

Inhaltsübersicht des Kapitels

• Frontend-Integration prüfen
• Paket sicher ausliefern
• Kontrollpunkt und Dokumentation

Dieses Kapitel behandelt Frontend-Integration prüfen, Paket sicher ausliefern. Die Reihenfolge orientiert sich am üblichen Arbeitsprozess von der Vorbereitung über die Umsetzung bis zur Prüfung.

Schritt 9.1: Frontend-Integration prüfen

Fachliche Ausarbeitung: Template-Pfade, Settings, Menüs, Sprachen, Medien und Fehlerzustände mit automatisierten und manuellen Tests abgedeckt. Praktische Umsetzung: Eine vollständige Abnahmeliste für das Sitepackage erstellt. Die entstandene Lösung wird mit einer Checkliste geprüft und bei Abweichungen gezielt korrigiert.

Schritt 9.2: Paket sicher ausliefern

Fachliche Ausarbeitung: Build, Composer-Installation, Cache, Konfigurationsänderungen und Rückfallweg dokumentiert. Praktische Umsetzung: Eine releasefähige Paketversion für Staging und Produktion vorbereitet. Ein definierter Kontrollpunkt gleicht Konfiguration, Funktion und redaktionelle Wirkung miteinander ab.

Kontrollpunkt und Dokumentation

Die Arbeitsergebnisse des Kapitels werden auf fachliche Vollständigkeit, sichere Konfiguration und reproduzierbare Umsetzung geprüft. Festgestellte Abweichungen werden priorisiert, korrigiert und in einer kompakten Betriebs- oder Redaktionsnotiz festgehalten.

Didaktischer Aufbau

Jeder Themenblock beginnt mit einer Einordnung, wird am System demonstriert und anschließend praktisch umgesetzt. Übungen bauen aufeinander auf, sodass am Ende eine zusammenhängende, prüfbare TYPO3-Konfiguration oder ein vollständiger redaktioneller Arbeitsablauf vorliegt.