Seiten-Templates mit Fluid
Bereits seit der TYPO3-Version 4.3 können Extension-Entwickler die neue Template-Engine Fluid für ihre Erweiterungen verwenden. Bedeutend weniger Aufmerksamkeit wurde – völlig unverdient – dem FLUIDTEMPLATE-Inhaltsobjekt zuteil, mit dessen Hilfe ab TYPO3 4.5 auch komplette Seitenlayouts mit Fluid umgesetzt werden können.
Ein Template erstellen
Das Template kann zunächst als reguläre HTML-Datei erstellt werden, vorzugsweise im fileadmin/-Ordner. Innerhalb des Templates steht die komplette Fluid-Syntax zur Verfügung: Auf Variablen, die über das TypoScript-Setup zugewiesen wurden, kann über die übliche Notation mit zugegriffen werden. Darüber hinaus kann etwa mit dem cObject-ViewHelper auch direkt auf TypoScript-Objekte zugegriffen werden, ohne dass diese explizit als Variable zugewiesen werden müssen. Ein solches Fluid-Template könnte also beispielsweise aussehen wie folgt:
<div id=“header“>
{siteName}
</div>
<div id=“navigation“>
<f:cObject typoscriptObjectPath=“lib.mysite.navigation“ />
</div>
<div>
<f:escape value=“{content}“ type=“raw“ />
</div>
Die Variable muss hier zwingenderweise in einem <f:escape>-ViewHelper verpackt werden, da Fluid ansonsten HTML-Sonderzeichen innerhalb dieser Variable codieren würde – grundsätzlich ein sinnvoller Sicherheitsmechanismus, der hier allerdings umgangen werden muss.
Das Template einbinden
Im Anschluss kann das Fluid-Template in das TypoScript-Setup der Seite eingebunden werden:
page = PAGE
page.10 = FLUIDTEMPLATE
page.10 {
file = fileadmin/template.html
layoutRootPath = fileadmin/layouts/
partialRootPath = fileadmin/partials/
variables {
siteName = TEXT
siteName.value = Meine Seite
content < styles.content.get
}
}
Eine vollständige Referenz aller Eigenschaften des FLUIDTEMPLATE-Objekts findet sich übrigens hier.
Layouts und Partials
Falls das Template sich wiederholende oder besonders komplexe Elemente enthält, können diese in ein sogenanntes Partial ausgelagert werden. Diese müssen in eigenen HTML-Dateien in dem Ordner liegen, der im FLUIDTEMPLATE-Objekt mit dem partialRootPath-Attribut beschrieben wurde. Ein solches Partial kann im eigentlichen Template mit dem <f:render>-ViewHelper angesprochen werden (wichtig: Das Partial muss ohne Dateiendung angegeben werden):
<div id=“search“>
<f:render partial=“search“ />
</div>
Über den <f:render>-ViewHelper können auch Layouts angesprochen werden; deren Verwendung macht allerdings nur Sinn, wenn innerhalb derselben Seite mehrere Fluid-Templates zum Einsatz kommen sollen.
Kommentare
Hallo Annika.
Habe mein Anliegen bereits im Forum gepostet. Anscheinend ist das ein seltenes Anliegen ;)
Beste Grüße
Hallo Reinhardt,
hierfür ist ebenfalls die Verarbeitung über Typoscript nötig. Weitere Informationen dazu findest du z. B. unter
Viele Grüße
Annika
Hallo Annika.
Vielen Dank für deine Antwort.
Jetzt habe ich dazu noch eine Frage:
Wenn ich mit Fluid eine dreispaltige Seitenstruktur aufbaue und in der mittleren (pluginMiddle) und der rechten Spalte (pluginRight) jeweils ein Plugin hinzufüge, wie kann ich dann in beiden Plugins die selben View-Parameter verwenden?
zB möchte ich in pluginMiddle und pluginRight auf einen View-Parameter zugreifen, den ich im Controller der View zugewiesen habe.
Beste Grüße und vielen Dank!
Hallo Reinhardt,
ich versuche gern, die Frage zu klären, muss aber erst Rücksprache mit den technisch versierten Kollegen halten ;) Ich würde dich daher gern noch einmal auf unser Forum typo3.net aufmerksam machen, dort gibt es viele User, die dir auch sehr gerne weiterhelfen.
Viele Grüße
Annika
Hallo zusammen.
Ich habe dazu noch eine Frage:
Ich habe eine Action. Im Controller weise ich der View einen Parameter hinzu:
$this->view->assign(„testView“, 1);
Im dazugeöhrigen Layout bzw. Partial kann problemlos darau zugreifen.
Wie kann ich aber im Template (fileadmin/template.html) auf diesen Parameter zugreifen? Muss ich diesen mit TypoScript an das Template übergeben oder gibt es da mit Fluid eine andere Möglichkeit?
Vielen Dank!
Hallo Reinhardt,
tatsächlich müsstest du die Variable für das Fluid-Template im TypoScript deklarieren.
Im oben genannten Beispiel wäre dies mit foglendem TypoScript umsetzbar:
page = PAGE
page.10 = FLUIDTEMPLATE
page.10 {
file = fileadmin/template.html
layoutRootPath = fileadmin/layouts/
partialRootPath = fileadmin/partials/
variables {
siteName = TEXT
siteName.value = Meine Seite
content < styles.content.get testView = TEXT testView.value = 1 } } Das FLUID-Template sollte daher nur für die Grundstruktur verwendet werden. Beispielsweise für die Umsetzung von einseitigen oder zweiseitigen Seitenstrukturen. Dynamische Seitenbereiche sollten entsprechend daher in des Layouts, Views (ebenfalls "Templates" genannt) und Partials verarbeitet werden. Übrigens: Fragen zu TYPO3 werden auch sehr gern von der Community auf unserem Forum typo3.net beantwortet. Hier kannst du dich mit vielen Gleichgesinnten austauschen. Ich hoffe, ich konnte dir weiterhelfen. Viele Grüße Annika
@steffen
etwas spät, wurde aber auch bereits gesagt:
-> gridelements
-> multicolumn
gridelements hat den nachteil, ist nicht ad hoc einsatzfähig.
musst erst das rad neu definieren (die gridelements). dafür sehr flexibel.
Guck Dir mal die DCE Extension an. typo3.org/extensions/repository/view/dce
Als FCE Ersatz (TV) scheinen sich zwei Extensions zu eignen, ich habe mir aber noch keine genauer angesehen:
Hallo Steffen,
dazu gab es einen Vortrag auf dem Münchner Camp, der auf gezeichnet wurde und bei Youtube steht. Such mal nach t3cm11.
Gruß Joscha
Die Frage von Steffen Thierock stelle ich mir auch!
Gibt es da eine Lösung?
@Steffen: Sieh dir mal ext:fed an ;-) Die bietet schon recht gute Features. Ist noch beta, aber funktioniert wunderprächtig!