Fluid Seiten-Templates

Seiten-Templates mit Fluid

In unserem aktuellen Kundenmagazin erklärt Mittwald Mitarbeiter und TYPO3-Experte Martin Helmich, wie Ihr mit Hilfe von Fluid Seiten-Templates erstellen könnt. Den Artikel gibt es nun hier im Blog als kleine Leseprobe.

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:

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:

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):

Ü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

  1. Gravatar
    Reinhardt Hartl am

    Hallo Annika.
    Habe mein Anliegen bereits im Forum gepostet. Anscheinend ist das ein seltenes Anliegen ;)

    Beste Grüße

    Antworten
    1. Annika Schwanitz am

      Hallo Reinhardt,

      hierfür ist ebenfalls die Verarbeitung über Typoscript nötig. Weitere Informationen dazu findest du z. B. unter

      Viele Grüße
      Annika

      Antworten
  2. Gravatar
    Reinhardt Hartl am

    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!

    Antworten
    1. Annika Schwanitz am

      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

      Antworten
  3. Gravatar
    Reinhardt Hartl am

    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!

    Antworten
    1. Annika Schwanitz am

      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

      Antworten
  4. Gravatar
    Kall am

    @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.

    Antworten
  5. Gravatar
    Armin am

    Guck Dir mal die DCE Extension an. typo3.org/extensions/repository/view/dce

    Antworten
  6. Gravatar
    Hauke Hain am

    Als FCE Ersatz (TV) scheinen sich zwei Extensions zu eignen, ich habe mir aber noch keine genauer angesehen:

    Antworten
  7. Gravatar
    Joscha Krug am

    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

    Antworten
  8. Gravatar
    Sebastian am

    Die Frage von Steffen Thierock stelle ich mir auch!

    Gibt es da eine Lösung?

    Antworten
  9. Gravatar
    Josef Florian Glatz am

    @Steffen: Sieh dir mal ext:fed an ;-) Die bietet schon recht gute Features. Ist noch beta, aber funktioniert wunderprächtig!

    Antworten

Kommentar hinzufügen