Skip to content

Latest commit

 

History

History
85 lines (80 loc) · 3.61 KB

README.md

File metadata and controls

85 lines (80 loc) · 3.61 KB
Raw

DMA SimpleGrid

Contao Erweiterung, die einfache Strukturen für Grid-Systeme bietet:

  • Row-Elemente (für Inhalts-Elemente und Formulare)
  • Spalten-Elemente (für Inhalts-Elemente und Formulare)
  • Selektoren für Spalten-Breiten sowie Offset-, Pull- und Push-Werte
  • Konfigurationsarray für Bootstrap und Foundation

Abhängigkeiten

https://github.com/menatwork/MultiColumnWizard

Installation

  • zunächst muss die Erweiterung MultiColumnWizard installiert werden.
  • anschließend kann die Erweitunerung DMA SimpleGrid installiert werden.
  • Im Contao-Backend befinden sich im Bereich Einstellungen nun neue Einstellungsmöglichkeiten für die Simple Grid-Erweiterung
    • Auswahl des zu verwendenden Frameworks oder Grid-System (CSS- und weitere Dateien werden nicht installiert, da hier jeder seine eigenen Ansprüche hat)
    • Auswahl der zu verwendenden Selektoren
  • Anschließend sollten bei den einzelnen Inhaltselementen Select-Felder zur jeweiligen Auswahl der Grid-Einstellungen zur Verfügung stehen.

Weitere Hinweise

Was diese Erweiterung nicht kann

  • CSS etc. werden durch diese Erweiterung nicht mitgebracht. Jeder kann es auf seine eigene Art und Weise in Contao integrieren
  • Kombinierte Grid-Einstellungen werden nicht auf vollständige Zeilen etc. validiert
  • Alle Grids können aufgrund ihrer Struktur nicht abgebildet werden. Insbesondere verschachtelte Div-Strukturen (wie sie beispielsweise bei YAML verwendet werden) lassen sich nicht realisieren.

Erweiterung der Grid-Einstellungen

Standardmäßig wird diese Erweiterung mit dem Support für das Contao Grid, das Grid von Bootstrap 3, Bootstrap 4, Foundation 6 und unsemantic sowie dem GoldenRatio Grid von uns ausgeliefert. Über eigene config.php-Dateien können weitere Grid-Systeme unterstützt werden (hier als Beispiel die Konfiguration für das Foundation-Grid):

$GLOBALS['DMA_SIMPLEGRID_CONFIG']['foundation'] = array
(
    'name' => 'Foundation',
    'config' => array
    (
        'hasRows' => true,
        'hasColumns' => true,
        'hasColumnOffset' => true,
        'hasColumnOffsetRight' => false,
        'hasColumnPush' => true,
        'hasColumnPull' => true,
        'hasRowClasses' => true,
        'hasColumnClasses' => true,
        'row-class' => 'row',
        'column-class' => 'columns',
        'columns-sizes' => array('1','2','3','4','5','6','7','8','9','10','11','12'),
        'columns-config' => array
        (
            'small' => array
            (
                'name' => 'small',
                'column-class' => 'small-%d',
                'offset-class' => 'small-offset-%d',
                'push-class' => 'small-push-%d',
                'pull-class' => 'small-pull-%d'
            ),
            'medium' => array
            (
                'name' => 'medium',
                'column-class' => 'medium-%d',
                'offset-class' => 'medium-offset-%d',
                'push-class' => 'medium-push-%d',
                'pull-class' => 'medium-pull-%d'
            ),
            'large' => array
            (
                'name' => 'large',
                'column-class' => 'large-%d',
                'offset-class' => 'large-offset-%d',
                'push-class' => 'large-push-%d',
                'pull-class' => 'large-pull-%d'
            )
        ),
        'additional-classes' => array
        (
            'row' => array('expanded'),
            'columns' => array
            (
                'end' => 'end',
                'small-centered' => 'small-centered',
                'medium-centered' => 'medium-centered',
                'large-centered' => 'large-centered'
            )
        )
    )
);