schmidtwebmedia/grid-for-container

Add an easy to use grid element for Container. It's Framework independent. Prepared for Bootstrap.

2.1.1 2023-04-26 05:57 UTC

Requires

• ext-json: *
• b13/container: ^1 || ^2
• typo3/cms-core: ^10.4 || ^11.5 || ^12.4

Replaces

• typo3-ter/grid_for_container: 2.1.1

GPL-2.0-or-later

• Marco Schmidt

• container
• bootstrap
• extension
• grid
• typo3

README

Description

You can use this extension for adding an easy to use Grid which are Framework independently.

It's pre-configured for Bootstrap 3, 4 and 5.

Important: The Bootstrap CSS/JS is not included

Features

There are Grid options to choose for an TYPO3 editor. Something like (e.g. two column)

• 50/50
• 33/66
• 25/75

This work for

• 1 column grid
• 2 column grid
• 3 column grid
• 4 column grid

Backend

Backend View

Frontend

Install

1. Install the extension container.
2. Install the extension grid_for_container
3. Include the static template
4. Be happy with an easy way to use Grids in TYPO3 :)

Composer install:

composer require schmidtwebmedia/grid-for-container

Customizing

You can customize the output in frontend and change the framework or add more options for Grid ratio. And change the path to JSON Config file in extension settings.

Please use following structure of json file:

{
  "cols": [
    {
      "onecol": [
        {
          "label": "",
          "class": [
            "",
            ""
          ]
        }
      ],
      "twocol": [
        {
          "label": "",
          "class": [
            "",
            ""
          ]
        }
      ],
      "threecol": [
        {
          "label": "",
          "class": [
            "",
            "",
            ""
          ]
        }
      ],
      "fourthcol": [
        {
          "label": "",
          "class": [
            "",
            "",
            "",
            ""
          ]
        }

      ]
    }
  ],
  "row": [
    {
      "class": ""
    }
  ]
}