-->

Bootstrap 3 not working in Symfony3

2020-07-13 11:42发布

问题:

I've just started to learn Symfony3, and I'm trying to theme my form using bootstrap3. According to the documentation, bootstrap_3_layout.html.twig is built-in and can be activated globally by altering the Twig settings in config.yml:

# Twig Configuration
twig:
    debug:            "%kernel.debug%"
    strict_variables: "%kernel.debug%"
    form_themes: 
        - "bootstrap_3_layout.html.twig"

When I reload the page, the page loads without CSS, the twig file and page source are as follows:

{# app/Resources/views/experiment/new.html.twig #}

{{ form_start(form) }}
{{ form_widget(form) }}
{{ form_end(form) }}


<form name="form" method="post">
<div id="form"><div class="form-group"><label class="control-label required" for="form_title">Title</label><input type="text" id="form_title" name="form[title]" required="required" class="form-control" /></div><div class="form-group"><button type="submit" id="form_save" name="form[save]" class="btn-default btn">Create Task</button></div><input type="hidden" id="form__token" name="form[_token]" class="form-control" value="O7tN2AUjyLByEz2tkNf675jqixxjev0p4ivzs5Bn4VA" /></div>
</form>

Which shows the bootstrap3 classes have been injected correctly. The site itself looks like this:

What step(s) have I missed to get the CSS to work correctly?

回答1:

You still have to add the bootstrap files, CSS and JS, to your application and templates. The form theme only ensures that the markup is well formed according to bootstrap.



回答2:

As an alternativ way you could include the bundle

https://github.com/phiamo/MopaBootstrapBundle

Into your Project and get the Bootstrap files (sass/less) Into your Project.

Documentation on Installation is also available on that Page. I'm using an self written integration that uses quite similar methods to.

Advantage is, that you can include custom sass into your project and compile into one single css file that you include in the template header.