TYPO3 - Gridelements

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 einige der folgenden Möglichkeiten.

Beispiel: Bootstrap Klassen über Layoutfeld setzen

http://wiki.zone30.info/wikizone/index.php/TYPO3_-_fluid_styled_content

TSconfig

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

        }
       }
}