TYPO3 - Gridelements: Unterschied zwischen den Versionen

Aus Wikizone
Wechseln zu: Navigation, Suche
Zeile 32: Zeile 32:
 
== Gridelements und Fluid Styled Content ==
 
== Gridelements und Fluid Styled Content ==
 
In TYPO3 v7 wird das alte css-styled-content durch fluid-styled-content ersetzt. Damit kann man das Rendering der Inhalte in Fluid-Templates überschreiben anstatt TypoScript zu benutzen. Siehe auch: [[http://wiki.zone30.info/wikizone/index.php/TYPO3_-_fluid_styled_content|TYPO3_-_fluid_styled_content]]. Das eröffnet neue Möglichkeiten.
 
In TYPO3 v7 wird das alte css-styled-content durch fluid-styled-content ersetzt. Damit kann man das Rendering der Inhalte in Fluid-Templates überschreiben anstatt TypoScript zu benutzen. Siehe auch: [[http://wiki.zone30.info/wikizone/index.php/TYPO3_-_fluid_styled_content|TYPO3_-_fluid_styled_content]]. Das eröffnet neue Möglichkeiten.
 +
=== Beispiel: Gridelements und Bootstrap ===
 +
Siehe auch: http://wiki.zone30.info/wikizone/index.php/TYPO3_-_fluid_styled_content#Beispiel:_Layoutfeld_mit_Bootstrap_Klassen_f.C3.BCr_Fluid_Styled_Content
 +
Gridelements bieten sich für Gridbasierte CSS-Frameworks an.

Version vom 14. Juli 2016, 15:07 Uhr

Links

https://www.youtube.com/watch?v=cuEKyaOtAEY

Einführung

Ähnlich wie im Backend Layout Editor werden Raster definiert, die man dann einsetzen kann. Das Rendering wird über TypoScript definiert.

Quickstart

  • Extension gridelements installieren
  • Ordner für gridelements anlegen
  • Grids erstellen
  • Rendering der Grids definieren

Grid Rendering definieren

tt_content.gridelements_pi1.20.10.setup{
  # ID des ge
  1 > lib.gridelements.defaultGridSetup
  1{
    columns{
      # colPos ID
      10 < .default
      10.wrap = <div class="s12 m8">|</div>
      # colPos ID
      20 < .default
      20.wrap = <div class="s12 m4">|</div>
    }
    wrap = <div class="row">|</div>
  }
}

Gridelements und Fluid Styled Content

In TYPO3 v7 wird das alte css-styled-content durch fluid-styled-content ersetzt. Damit kann man das Rendering der Inhalte in Fluid-Templates überschreiben anstatt TypoScript zu benutzen. Siehe auch: [[1]]. Das eröffnet neue Möglichkeiten.

Beispiel: Gridelements und Bootstrap

Siehe auch: http://wiki.zone30.info/wikizone/index.php/TYPO3_-_fluid_styled_content#Beispiel:_Layoutfeld_mit_Bootstrap_Klassen_f.C3.BCr_Fluid_Styled_Content Gridelements bieten sich für Gridbasierte CSS-Frameworks an.