T3 Campus T3 Campus

Dein Kickstart in Extbase und Fluid (ab TYPO3 10)

Ich zeige dir den Weg von Aufruf einer Webseite über die Ausführung von PHP bis hin zur HTML Code in TYPO3. Danach machen wir einen kleinen Überflug durch das TYPO3 Backend und Frontend, was du als Programmierer beeinflussen kannst.

TYPO3 ist ein sehr modernes Framework und das fortschrittlichste mit dem ich bisher gearbeitet habe. TYPO3 nutzt die volle Bandbreite von PHP 7 und du hast die richtige Entscheidung getroffen, dich mit TYPO3 zu befassen. TYPO3 ist die Zukunft und wird zukünftig noch eine wesentlich größere Rolle im Web spielen.

Ein Webrequest wird im Hinblick auf die Extensionprogrammierung wie folgt abgearbeitet:

  1. Benutzer ruft die TYPO3 Webseite auf
  2. TYPO3 empfängt die URL und verarbeitet Sie
    1. sind Frontend Plugins (Extensions) auf diese Seite platziert?
      1. wenn ja, ist ein Controller und eine Action - Funktion explizit angegeben?
      2. wenn ja, dann rufe auf
      3. wenn nein, dann suche den Default Controller und Action - Funktion

Dann sind wir schon direkt im Code. TYPO3 wird dann den Controller ausführen und in dem Controller die relevante Action - Funktion.

Was ist ein Controller und eine Action - Funktion?

Ein Controller ist zunächst eine PHP - Klasse. Sie ist direkter Bestandteil des MVC(ontroller) - Modells und ist der Delegierer von Prozessen. Dementsprechend ist er die erste Anlaufstelle in einer Extension.

Eine Action - Funktion ist eine PHP Funktion, die öffentlich (public) ist. Darüber hinaus hat sie dem Suffix: Action.

Action - Funktionen sind Funktionen, die direkt auf einen Request reagieren. Vereinfacht ausgedrückt, kann man mit einem Request, als Seitenaufruf, eine Action - Funktion ausführen.

Damit bindet der Controller und die Action - Funktionen die Schnittstelle von Webrequest zu einer Extension.

Beispiel:

class ColumnsController extends \TYPO3\CMS\Extbase\Mvc\Controller\ActionController {
    ...
    public function showAction() {
        ...
    }
    ...
}

Innerhalb der Action - Funktion gehen dann alle Prozesse ab, die man benötigt um alle angefragten Informationen vom Benutzer zu sammeln. 

Die Darstellung der Informationen übernimmt Fluid.

Fluid ist die Templatengine von TYPO3. Fluid ist eine sehr saubere Sprache, die auf xHTML basiert. Es gibt keine Mischung von HTML und PHP Code. Ich weiß, dass versprechen viele Frameworks, aber bei TYPO3 ist es Wirklichkeit.

In Fluid kannst du ganz normal HTML5 Code schreiben. Die Schnittstelle zu TYPO3 bzw. Extbase sind dann die zahlreichen sogenannten ViewHelper von Fluid. Damit lässt sich zum Beispiel:

  • Formulare erstellen
  • Links generieren
  • Bilder ausgeben
  • Schleifen nutzen (for - Schleife)
  • und vieles mehr

Um die Templates zu strukturieren, gibt es in Fluid 3 Typen von Templatedateien:

  1. Templates
  2. Layouts
  3. Partials

Um innerhalb einer Template- und Partialdatei Struktur hereinzubringen, gibt es zusätzlich sogenannte Section.

Die 3 Typen der Templatedateien in TYPO3

Die Templatedatei ist die zentrale Datei. Diese Datei wird von Extbase als erstes angesteuert, sobald die Action - Funktion vollständig ausgeführt wurde.

Die Templatedatei kann dann HTML Teile, die wiederverwendet werden sollen, von anderen Controllern in Partialdateien ausgelagert werden. Eine Partialdatei ist einfach eine neue HTML-Datei in einem speziellen Ordner.

Falls man wiederverwendbare Abschnitte hat, die innerhalb einer Template- oder Partialdatei wiederverwendet werden, dann kann man diese Teile innerhalb der selbigen Datei in Sections auslagern.

Wie findet TYPO3 die richtige Fluid-Datei?

Der Name des Controllers und der Name der Action Funktion, jeweils ohne die Zusätze: Controller und Action, sind die Namensgeber des Ordners und der Templatedatei.

Beispiel

Controller Name: ColumnsController

Action Funktionsname: showAction()

Dann muss die Templatedatei: Show.html im Ordner Columns liegen.

Innerhalb der Show.html kann man dann, wenn man das möchte und braucht, andere HTML Dateien einbinden, die Codeteile beinhalten, die mehrfach genutzt werden. Die Section ist ähnlich, auch mit der Section kann man Codeteile auslagern und einfach wiederverwenden. Der Unterschied ist, dass eine Section immer innerhalb einer Template- oder Partialdatei liegt und somit dafür genutzt werden sollte, um Codeteile auszulagern, die auch nur dort mehrfach verwendet werden. 

Partialdateien hingegen sind für Codeabschnitte, die Controllerübergreifend in der Extension wiederverwendet werden.

Partials

Ein Aufruf einer Partialdatei kann so aussehen:

<f:render partial="Columns/Column" arguments="{_all}" />

Hier rufen wir die Partialdatei: Column.html auf in dem Unterordner Columns, ausgehend von dem Startordner aller Partialdateien. Wir können einer Partialdatei auch Argumente übergeben. Im obigen Beispiel übergeben wir alle Argumente, die auch für die aktuelle Templatedatei zur Verfügung stehen.

Sections

Der Aufruf einer Section kann so aussehen:

<f:render section="Column" arguments="{_all}" />
...
<f:section name="Column">
    <!-- xHTML CODE HIER -->
</f:section>

Mit dem Aufruf in Zeile 1 springt TYPO3 dann in die Section, die in der gleichen Datei liegen muss und platziert and er gleichen Stelle den ausgeführten Code. Wir können dann die Section mehrfach, beispielsweise über eine FOR - Schleife aufrufen.

Layouts

Die Layoutdatei ist die übergeordnete Datei der Templatedatei. Jede Templatedatei kann entscheiden, ob es eine Layoutdatei nutzen möchte. Sie kann auch gezielt eine bestimmte Layoutdatei ansteuern.

Fluid wird dann diese Layoutdatei laden und den Code dort ausliefern. Innerhalb der Layoutdatei muss dann eine Section aufgerufen werden. In dieser Section wird dann der eigentlich Inhalt der Templatedatei kopiert. Das bedeutet, dass innerhalb der Templatedatei diese Section existieren muss. 

Die Layoutdatei ist damit die Ausnahme bei der Nutzung von Sections, wo die Section nicht Teil der Layoutdatei ist, sondern der Templatedatei, die diese Layoutdatei einbindet.

Beispiel

Templatedatei

<f:layout name="Default" />

<f:section name="Main">
....
</f:section>

Layoutdatei

Die Layoutdatei kann dann so aussehen:

...
<f:section name="Main" />
...

Du siehst, du hast in Fluid sehr gute Mittel, um deinen HTML-Code zu strukturieren. Dabei wird zu 100 % xHTML genutzt und es findet keine Mischung von xHTML mit PHP statt.

Was kann ich alles programmatisch beeinflussen?

TYPO3 ist ein sehr modernes Framework, welches moderne Softwaretechniken einsetzt. In TYPO3 kann man über folgende Mitteln:

  1. Eigene Extensions
    1. Frontend Plugins
    2. Backend Module
  2. Änderung / Erweiterung vorhandene Plugins und Module
    1. EventDispatcher
    2. Hooks
    3. XClass

im Frontend und im Backend alles beeinflussen. In TYPO3 ist es nicht notwendig Quelldateien zu ändern, es gibt für alles eine Schnittstelle.

Das Frontend ist sowieso das Hoheitsgebiet der TYPO3 Redakteure, Integrator und Entwickler. Sie entscheiden, was im welchem Format im Frontend wo angezeigt wird. Doch auch das Backend ist durch die obigen Schnittstellen beeinflussbar.

Das TYPO3 Backend

Hier ein paar Beispiele

Du kannst eigene Backend Module erstellen. Backend Module ist das, was du im TYPO3 Backend auf der linken Seite siehst. Du kannst dementsprechend eigenen Modulinhalt kreeiren. Beispielsweise einfachere Eingabeoberflächen für Inhaltselemente. Du kannst auch eigene Inhaltselemente erstellen und genau bestimmen, wie sie im PAGE Modulinhalt dargestellt werden.

Du kannst auch Einfluss auf das Rendering andere Inhaltselemente nehmen oder im Speicherprozess eingreifen. Du kannst wirklich alles in TYPO3 tun, über definierte Schnittstellen.

Ohne Hacks und Workarounds.

Du siehst, du hast die beste Wahl mit TYPO3 getroffen.

Bereit mehr zu lernen?

Dann komme in meine TYPO3 Onlineschule

Als Mitglied des T3 Campus für TYPO3 Schulungen erhältst du eine einzigartige Lernplattform, um professionelle Webseiten mit TYPO3 zu erstellen. Egal, ob du ein Einsteiger, Umsteiger oder bereits erfahren bist – hier findest du die passenden Lernvideos für dich.

Kevin Chileong Lee

Gründer vom T3 Campus, TYPO3 Experte mit 10+ Jahren Erfahrung, TYPO3 Liebhaber.

Ich helfe dir dabei, deine Projekte in TYPO3 umzusetzen.

Insbesondere für TYPO3 Einsteiger biete ich zahlreiche kostenfreie Tutorials und kostenpflichtige Kurse rund um TYPO3 an.
Damit kannst du in wenigen Tagen auch ohne Vorkenntnisse deine erste TYPO3 Webseite erstellen und Erweiterungen programmieren.

Auf meinem YouTube-Kanal findest du viele praktische Beispiele und Videotutorials als auch allgemein Videos zu diversen TYPO3 Themen.

Neber den TYPO3 Tutorials und Kopiervorlagen, schreibe ich auch Artikel auf meinem Blog über diverse Themen und Fragen, die die meisten TYPO3 Einsteiger, haben.

Falls du ein TYPO3 Coaching suchst, dann stehe ich dir in einer 1:1 Trainingssession zur Verfügung.

Wenn du auf dem Laufenden sein möchtest über meine Projekte, dann abonniere den Newsletter.