---
title: "Feature: #94868 - Introduce Bootstrap 5 compatible and accessible templates"
manual: "TYPO3 Core Changelog"
version: "main"
permalink: "https://docs.typo3.org/permalink/changelog:feature-94868"
source: "Changelog/11.5/Feature-94868-IntroduceBootstrap5CompatibleAndAccessibleTemplates.rst"
modified: "2026-09-15T10:46:36+00:00"
---

# Feature: #94868 - Introduce Bootstrap 5 compatible and accessible templates

See [forge#94868](https://forge.typo3.org/issues/94868)

## Description

Until now, CSS classes of the frontend templates and partials of the Form
Framework were not consistently included in the form configuration. So far
some classes were present in the form configuration, others were hardcoded
only in the Fluid templates.

This situation has now been fixed for the Bootstrap 5 compatible template
variants stored in `EXT:form/Resources/Private/Frontend/Version2`.
All CSS classes are consistently defined in the form configuration.

This simplifies the integration of the frontend. The change makes it easier for
integrators to make upgrades of the frontend framework. In most cases, it is
now no longer necessary to override a Fluid template for changes to classes.
Instead, it is only necessary to add the appropriate CSS classes to the
form configuration.

In order not to be breaking, by default the templates are still rendered
as they used to be.

To use the new Bootstrap 5 compatible templates the form rendering option
`templateVariant` must be set from `version1` to `version2` in your form setup:

```yaml
TYPO3:
  CMS:
    Form:
      prototypes:
        standard:
          formElementsDefinition:
            Form:
              renderingOptions:
                templateVariant: version2
```

The CSS classes for the Bootstrap 5 compatible templates are defined
in the variant with the name `template-variant` for each form element.
This is an example of the text element:

```yaml
TYPO3:
  CMS:
    Form:
      prototypes:
        standard:
          formElementsDefinition:
            Text:
              variants:
                -
                  identifier: template-variant
                  condition: 'getRootFormProperty("renderingOptions.templateVariant") == "version2"'
                  properties:
                    containerClassAttribute: 'form-element form-element-text mb-3'
                    elementClassAttribute: form-control
                    labelClassAttribute: form-label
```

To be able to access the configuration of the root element (type "Form")
in conditions, a new function `getRootFormProperty()` has been introduced,
which can be used to access the properties of the "Form" element.
In the context of the "template-variant" variants this is used to determine
the template variant defined on the "Form" element in order to change the
CSS configuration properties or to add new ones.

In the course of Bootstrap 5 compatibility two new breakpoints "xl" and
"xxl" were added to the grid configuration which are also available in the
form editor.