TypoScript gilt als ein zentrales Element des TYPO3 CMS. Dieser Beitrag gibt einen Überblick darüber, was TypoScript ist, wofür es benötigt wird und wie es funktioniert. Darüber hinaus geben wir praxisnahe Tipps.
TypoScript ist die deklarative Konfigurationssprache von TYPO3, mit der das Rendern der Frontend-Ausgabe sowie viele Eigenschaften von Seiten, Inhalten und Extensions konfiguriert werden. Es ist keine Programmiersprache, sondern ein regelbasiertes Konfigurationsformat, das TYPO3 zur Laufzeit interpretiert. Es dient lediglich dazu, zu definieren, welche Daten wie dargestellt werden.
Der Begriff TypoScript umfasst sowohl die Frontend-Konfiguration als auch die Backend-Konfiguration. Letztere wird in TYPO als TSConfig bezeichnet. Während Frontend-TypoScript die Website-Ausgabe im Browser steuert (Design, Inhalt, Templates), ist TSConfig für Anpassungen im Backend zuständig. Die Frontend-Konfiguration ist für die Seitenausgabe und die meisten Integrationsaufgaben relevant.
TypoScript wurde vor vielen Jahren direkt vom TYPO3-Gründer entwickelt. Ziel war es Websites ohne PHP-Kenntnisse konfigurieren zu können. Mittlerweile hat es sich als unverzichtbares Werkzeug etabliert. Viele sehen es als das "Herz" von TYPO3, da es die hohe Flexibilität des CMS ermöglicht. Ohne TypoScript läuft in TYPO3 praktisch nichts.
TypoScript folgt einer hierarchischen Baumstruktur aus Objekten und Eigenschaften. Die Syntax verwendet die Punkt-Notation und geschweifte Klammern für Unterebenen. Zum Beispiel definiert page = PAGE ein Top-Level-Objekt page. page. = TEXT weist diesem Objekt ein TEXT-Element zu. page..value = Hallo Welt setzt den Wert dieses TEXT-Elements. Intern wandelt TYPO3 diese Struktur in ein mehrdimensionales PHP-Array um.
Konzeptionell unterteilt sich TypoScript in Konstanten und Setup. Im Setup-Teil wird definiert, was ausgegeben wird (Seitenaufbau, Inhalte, Templates). Im Konstanten-Teil werden globale Werte definiert, die im Setup verwendet werden können. Bewährt hat sich, veränderliche Werte wie Pfade oder IDs als Konstanten zu pflegen, um sie zentral anpassen zu können. Konstanten und Setup werden in separaten Dateien (constants.typoscript, setup.typoscript) oder Backend-Feldern verwaltet.
TypoScript ist case-sensitive. Groß- und Kleinschreibung muss exakt beachtet werden. Ein Fehler kann dazu führen, dass eine Anweisung ignoriert wird.
Für Objekt-Bezeichner dürfen nur Buchstaben, Ziffern, Unterstrich, Bindestrich und Punkt verwendet werden. Unerlaubte Zeichen müssen "escaped" werden. Dies sorgt für eine eindeutige Struktur.
Die Notation objekt.untereinheit.eigenschaft = Wert wird häufig verwendet. Ein Punkt kennzeichnet, dass ein Objekt Unterobjekte oder Eigenschaften hat. Wenn ein Objekt selbst weitere Konfigurationen enthält, werden diese in geschweiften Klammern geschrieben.
myObject = TEXT
myObject {
value = Beispiel
wrap = <strong>|</strong>
}
Hier wird myObject als TEXT-Objekt definiert und seine Eigenschaften innerhalb der Klammern festgelegt.
In einem TYPO3-Projekt wird typischerweise ein Root-Template-Datensatz im Backend angelegt, wo Konstanten und das Setup eingegeben werden können. Es ist jedoch eine Best Practice, den Code in Dateien auszulagern und per @import einzubinden. Am besten wird das über eine Sitepackage-Extension realisiert, in der alle Konfigurationen versioniert verwaltet werden. Moderne Projekte nutzen fast immer ein eigenes Sitepackage.
Es ist ratsam, den Code in logische Einheiten aufzuteilen, zum Beispiel separate Dateien für Navigation, Footer oder Extensions zu verwenden. Diese können dann in der Haupt-Setup-Datei importiert werden. Das Aufsplitten verbessert die Übersicht und die Zusammenarbeit im Team.
Typische Anwendungsfälle, die mit TypoScript gesteuert werden können:
Diese Beispiele zeigen, dass TypoScript nahezu alle Bereiche der TYPO3-Integration durchdringt. Es ermöglicht umfangreiche Anpassungen von Funktion und Darstellung ohne PHP-Code.
Früher wurde das Seitenlayout oft rein mit TypoScript aufgebaut. Heute wird stattdessen Fluid, das Templating-System von TYPO3, für das Markup (HTML) verwendet. Fluid ist eine Templating-Engine mit HTML-ähnlicher Syntax.
TypoScript und Fluid arbeiten zusammen: TypoScript liefert die Daten und wählt die Templates aus, während Fluid das eigentliche HTML-Design enthält. In der Praxis wird per TypoScript ein PAGE Objekt definiert, dem ein FLUIDTEMPLATE zugewiesen wird. Dieses verweist auf die Template-Datei. Per TypoScript können auch Daten oder Einstellungen an das Fluid-Template übergeben werden. Fluid rendert dann die finale HTML-Ausgabe.
Ein Beispiel: Nur TypoScript:
page = PAGE
page.10 = TEXT
page.10.value = Hello, world.
TypoScript erzeugt hier direkt den Inhalt.
Mit Fluid:
page = PAGE
page.10 = FLUIDTEMPLATE
page.10.file = fileadmin/templates/Index.html
Hier lädt TypoScript eine Template-Datei, die den Inhalt enthält.
Dieser Ansatz trennt Layout und Logik. Das HTML kommt aus der Fluid-Datei, TypoScript bindet sie ein und stellt dynamische Daten bereit. Dies ist wartbarer als das Zusammenbauen von HTML in TypoScript. Moderne TYPO3-Projekte nutzen daher immer eine Mischung aus TypoScript (Konfiguration) und Fluid (Markup).
Für einen effizienten und sauberen Einsatz von TypoScript:
TypoScript kann anfangs komplex erscheinen, ist aber essentiell, um das volle Potenzial von TYPO3 auszuschöpfen. Es fungiert als flexible Konfigurationssprache, die Templates, Inhalte, Menüs, Meta-Daten und mehr steuert. Mit den Best Practices lässt sich TypoScript übersichtlich und effizient einsetzen, auch für umfangreiche Websites.
Im Umgang mit TypoScript kann die Erfahrung einer spezialisierten Agentur von Vorteil sein. Als spezialisierte TYPO3 Agentur verfügt 3m5. über langjährige Erfahrung mit TYPO3-Projekten und hat zahlreiche Websites umgesetzt. Als TYPO3 Platinum Member mit zertifizierten Entwicklern und Integratoren setzen wir saubere TypoScript-Konfiguration für Sie um.
Im Sinne des Open Source Gedanken nutzen wir unser Coding-Wissen gemeinsam mit anderen, um Neos noch besser zu machen. Ein Einblick in die kollaborative Arbeit am Neos Core.
