Grégoire Pineau
Contributed by Grégoire Pineau in #10272

Bootstrap is the most popular HTML, CSS, and JavaScript framework for developing responsive, mobile first projects on the web. Bootstrap is so widely used that it has become the de facto standard for frontend development. That's why Symfony 2.6 will include a new form theme designed for Bootstrap 3.

The new form theme comes in two flavors: normal layout and horizontal layout. To apply this new theme to all the forms of your application, use the following configuration:

1
2
3
4
5
# app/config/config.yml
twig:
    form:
        resources: ['bootstrap_3_layout.html.twig']
        # resources: ['bootstrap_3_horizontal_layout.html.twig']

To apply this theme only for some forms, add the following instruction at the top of the Twig template where the form is defined:

1
2
{% form_theme form 'bootstrap_3_layout.html.twig' %}
{# {% form_theme form 'bootstrap_3_horizontal_layout.html.twig' %} #}

The new theme defines styles for all types of form controls, as shown in the following image:

Symfony Bootstrap Form Theme

As you probably guessed, this new feature is part of the Symfony DX initiative. We believe that having a built-in Bootstrap theme will save you lots of hours of tedious and repetitive work.

Although this pull request just adds two tiny Twig templates, it took eight months to get merged. In fact, this was the most commented pull request in Symfony's history (196 comments at the time of writing this post) and provoked some lively discussions between proponents and opponents of it.

Published in #Living on the edge