Symfony2 - controller response with CSS based .html

Question

I've started my work with Symfony2 recently and I've created basic controller :

    class HelloController extends Controller
{
    /**
     * @Route ("hello/{name}");
     */

    public function HelloAction($name)
    {
        $htmlResp = $this->render('hello/hello.html.twig', array('userName'=>$name));
        $htmlResp->headers->set('Content-Type', 'text/html');
        return $htmlResp;
    }
}

and my hello.html file is just a basic code with bootstrap.css included :

.
.
.
{% block stylesheets %}
        <!-- Bootstrap core CSS -->
        <link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet" />
        <!-- Custom styles for this template -->
        <link href="{{ asset('starter-template.css') }}" rel="stylesheet" />
        <!--<script src="../../assets/js/ie-emulation-modes-warning.js"></script> -->
    {% endblock %}
.
.
.
{% block body %}
    <nav class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
.
.
.

<div class="container">
        <div class="starter-template">
            <h1>Welcome!</h1>
            <p class="lead">Hello, my dear friend named : {{ userName }}</p>
        </div>

    </div><!-- /.container -->

{% endblock %}
.
.
.

(dots are inserted to shorten unimportant code fragments).

In result of entering "localhost:8000/hello/SomeName" plain html website is displayed (no CSS files loaded at all).

I would be grateful for any tips how to force it to load and display well-formated site with CSS.

Answer 1

Allright. If I were you I would do the following:

1. Make sure assets are installed
2. Just to make it clear - put all your assets stuff in web directory(this directory is public so when page is requested browser can download rquired files)

3. Prepare basic temaple.

4. Extend the basic template in the template you want to render(example)

Code:

{% extends "base.html" %}

{% block title %}Index{% endblock %}

{% block head %}
    <!-- some content here -->
{% endblock %}

{% block content %}
     <!-- some content here -->
{% endblock %}

Now it's segregated and consistent and you have all things included in one place. Make sure that path to your css files is correct. If you are not sure just view the page source and try to click the link generated by asset() and see if it takes you to the file.

Define all the blocks in base template and then overwrite them in other templates.