Predefined gridelements Bootstrap 5 content elements: column grids, grids for simple accordions, and tabs.
- Install the extension via composer:
composer require laxap/bootstrap-grids. Ifgridelementsis not installed, it will be installed automatically since it's a requirement. - Include the static TypoScript templates. Both
bootstrap_gridsandgridelementstemplates are required (the order of templates is important).
NOTE: As of 2025-03-03, gridelements v12 doesn't support PHP 8.4, but we have an issue open they are responding to fix that. So, we will preemptively support PHP 8.4 in anticipation of that fix.
Use one of the predefined grids on your website.
NOTE: When using "Tabs From Content Elements" and "Accordion From Content", you need to set the header Type to Hidden. If you don't then the accordion/tab title will also display as a heading tag in the content area.
The paths of TypoScript files have changed. Please ensure you reselect the template in your sys_template record.
We would love your help! We have Docker set up with helper scripts to make contributions easy.
- Install Docker.
- Fork the boostrap_grids repository.
- Clone the forked repository (e.g.
git clone https://github.com/your_username/bootstrap_grids.git), change into the directory, then checkout a branch or create desired branch. - OPTIONAL: Do
cp -i .docker/.env.dist .docker/.envbefore the next step if you need anything other than default versions of TYPO3/PHP. Otherwise.docker/.env.distwill automatically be copied to.docker/.envif it doesn't already exist and you can skip this step. - Run
.docker/bin/start. - OPTIONAL: Start Xdebug if you need to debug PHP code.
- Login to http://localhost:8080/typo3 with username
adminand passwordPass123!.
NOTE: The .docker/templates/[typo3-version-specified-in-.env] directory is copied to the project root during .docker/bin/start, so from that point on you'll need to edit files in their new location to see live changes. When you're done with the install, you can delete the container and those copied files by doing .docker/bin/clean or by doing it manually.
| Command | Description |
|---|---|
.docker/bin/start |
To start dev environment |
.docker/bin/stop |
To stop dev environment |
.docker/bin/clean |
Does docker compose down --remove-orphans and deletes generated/copied files (except .docker/.env) and resets the database to its initial state using the starting point in .docker/templates/database/database.sqlite |
.docker/bin/logs |
Runs .docker/bin/compose logs -f |
.docker/bin/cli |
Enter the dev environment container |
.docker/bin/composer [command] |
Runs composer commands (e.g. ./docker/bin/composer install) |
.docker/bin/typo3 [command] |
Runs vendor/bin/typo3 commands (e.g. .docker/bin/typo3 cache:flush) |
.docker/bin/compose [command] |
Runs docker compose commands (e.g. ./docker/bin/compose up -d --build) |
- Upgrade for TYPO3 13
- UPDATED: Switched to Bootstrap 5
- UPDATED: Enhanced Docker experience for easier development
- REMOVED: Optional row gridelement
- UPDATED: Switched to Bootstrap 4
- REMOVED: Slider grid element and flexslider script
- ADDED: 2-/3-/4-columns grid
itemProcFuncfor select items - ADDED: Optional row gridelement
- ADDED: Backend, drag & drop support: default col-md-6/4/3 classes are used for the column divs in the frontend if a gridelement is dragged into the page without editing it.
- UPDATED: Changed from empty to a blank character for the 2-/3-/4-columns grid the
not setoption value of the desktop column classes (first tab). - REMOVED: Optional support for old record based grid definitions removed
- REMOVED: Optional row gridelement
- Daniel Corn: Defining the grids via pageTS brings a lot of advantages.
- Josef Körner: For reducing the accordion TypoScript setup.