How to add Twitter Bootstrap to a Symfony 2 application

Note: the following assumes you are not using gulp, grunt or another workflow tool. If you are, and want to include downloading and compiling Bootstrap and JQuery into your workflow, see their websites for more information on how to do this.

  1. Download the latest version of Bootstrap from http://getbootstrap.com/.
  2. If you extract the zip file, you will notice 3 folders:
    |-css
    |-fonts
    |-js
    
  3. Copy these into your web directory so that your web directory looks like the following:

    |-web
        |-css
        |-fonts
        |-js
    
  4. Download jquery minified version from https://jquery.com/
  5. Save this file into your web/js directory
  6. In you app/Resources/views/base.html.twig file, add the following:
    <!-- in head tag -->
    <link rel="stylesheet" href="{{ asset('css/bootstrap.css') }}" />
    <link rel="stylesheet" href="{{ asset('css/bootstrap-theme.css') }}" />
    
    <!-- at end of body tag -->
    <script src="{{ asset('js/jquery.min.js') }}"></script>
    <script src="{{ asset('js/bootstrap.min.js') }}"></script>
    

    If you are using the default base.html.twig file, it will look like this:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8" />
            <title>{% block title %}Welcome!{% endblock %}</title>
            {% block stylesheets %}{% endblock %}
            <link rel="icon" type="image/x-icon" href="{{ asset('favicon.ico') }}" />
            <link rel="stylesheet" href="{{ asset('css/bootstrap.css') }}" />
            <link rel="stylesheet" href="{{ asset('css/bootstrap-theme.css') }}" />
        </head>
        <body>
            <h1>app/Resources/view/base.html.twig</h1>
             {% block nav %}{% endblock %}
            {% block body %}{% endblock %}
            <script src="{{ asset('js/jquery.min.js') }}"></script>
            <script src="{{ asset('js/bootstrap.min.js') }}"></script>
            {% block javascripts %}{% endblock %}
        </body>
    </html>
    

Bonus:
Symfony includes a form theme for Bootstrap out of the box. To enable Bootstrap in your forms without having to create custom templates, simply add the following to your app/config/config.yml file:

twig:
    form:
        resources: ['bootstrap_3_layout.html.twig']
        # resources: ['bootstrap_3_horizontal_layout.html.twig']

Source: http://symfony.com/blog/new-in-symfony-2-6-bootstrap-form-theme