TYPO3 - fluid styled content

Migration von css_styled_content zu fluid_styled_content ist möglich

1. fluid_styled_content aktivieren (ExtensionManager)
2. css_styled_content deaktivieren
3. Upgrade Wizard im Install Tool

Beispiel: Layout von fluid_styled_content Elementen anpassen

https://jweiland.net/video-anleitungen/typo3/typo3-projekte-verwalten/fluid-styled-content-templates-anpassen.html

Das Rendering läßt sich einfacher anpassen als bei css_styled_content, da man nicht mehr so viel TypoScript braucht.

1. TypoScript für die Template Pfade erweitern
2. Benötigte Templates kopieren und anpassen

TypoScript anpassen

Das TypoScript für fluid_styled_content läßt sich erweiteren, so daß TYPO3 nach deinen eigenen Vorlagen schaut, die wiederum die Originale überschreiben.

lib.fluidContent.templateRootPaths.0 = EXT:fluid_styled_content/Resources/Private/Templates/
lib.fluidContent.partialRootPaths.0 = EXT:fluid_styled_content/Resources/Private/Partials/
lib.fluidContent.layoutRootPaths.0 = EXT:fluid_styled_content/Resources/Private/Layouts/

Hier kann man jetzt eigene Pfade hinzufügen. In diesen Pfaden sucht TYPO3 nach Inhaltselementen mit denen es die Originale überschreibt:

lib.fluidContent.templateRootPaths.10 = fileadmin/fluid_styled_content/Templates/
lib.fluidContent.partialRootPaths.10 = fileadmin/fluid_styled_content//Partials/
lib.fluidContent.layoutRootPaths.10 = fileadmin/fluid_styled_content/Layouts/

Beispiel: Layoutfeld mit Bootstrap Klassen für Fluid Styled Content

In diesem Beispiel möchten wir über das Layout-Feld im Backend Bootstrap Klassen setzen und die Fluid Styled Content Templates so überscheiben, daß sie dementsprechend gesetzt werden.

1. Layoutfeld mit Bootstrap Klassen ausstatten

TSconfig

TCEFORM.tt_content {
  layout {
    altLabels {
      1 = 1 Spalte
      2 = 2 Spalten
      3 = 3 Spalten
    }
    addItems{
      4 = 4 Spalten
      5 = 5 Spalten
      6 = 6 Spalten
      7 = 7 Spalten
      8 = 8 Spalten
      9 = 9 Spalten
      10 = 10 Spalten
      11 = 11 Spalten
      12 = 12 Spalten
    }
  }
}

2. Templates aus Fluid Styled Content bearbeiten

Um die Ausgabe von FSC zu verändern kopiert man die Originaldateien, ändert die Pfade zu den Templates in den Constants und ändert diese dann.

• Kopieren aus typo3/sysext/fluid_styled_content
• an neuen Ort z.B. in einer Distribution oder in den fileadmin ordner
• TypoScript Konstanten überschreiben, wenn nicht alle Dateien kopiert wurden arbeitet TYPO3 mit den alten Dateien als Fallback

resourceDir = EXT:myextensionname/Resources
# ...
# Fluid Styled Content Templates neu zuweisen
styles.templates {
	templateRootPath = {$resourceDir}/FluidStyledContent/Templates
	partialRootPath = {$resourceDir}/FluidStyledContent/Partials
	layoutRootPath = {$resourceDir}/FluidStyledContent/Layouts
}

• Templates anpassen