====== Creating and Using Templates ====== ===== TL;DR ===== * Templates typically live in ''app/Resources/views/''. * Third-party bundle templates live in ''path/to/bundle/Resources/views/''. (The command line generator puts them here too it seems, which I believe is no longer a best practice.)


{# == basics == #}
{# comment #}
{{ varname }}
{% doSomething %}
{{ varname|filtername }}

{# == inheritance == #}
{# a block defined in the parent: #}
{% block blockname %}
    block content
{% endblock %}

{# can be overridden in child template: #}
{% extends 'parent.html.twig' %}
{% block blockname %}
    new content
    {# get content of parent's block #}
    {{ parent() }}
{% endblock %}

{# create links using path() or url() and route name #} 
Relative link
Absolute link

{# use asset() to get assets #}

===== Templates ===== ==== Twig Template Caching ==== ===== Template Inheritance and Layouts ===== ===== Template Naming and Locations ===== ==== Referencing Templates in a Bundle ==== ==== Template Suffix ==== ===== Tags and Helpers ===== ==== Including other Templates ====


{% for article in articles %}
    {{ include('article/article_details.html.twig', { 'article': article }) }}
{% endfor %}

==== Embedding Controllers ==== namespace AppBundle\Controller; class ArticleController extends Controller { public function recentArticlesAction($max = 3) { // get the "$max" most recent articles $articles = ...; return $this->render( 'article/recent_list.html.twig', array('articles' => $articles) ); } } with a template {% for article in articles %} {{ article.title }} {# hardcoded URL above is not a best practice. #} {% endfor %} and the embed using the ''controller()'' call: {# ... #} ==== Asynchronous Content with hinclude.js ==== ? ==== Linking to Pages ====


{# relative links with path(): #}
Home
Dynamic link

{# absolute links with url(): #}
Home
Dynamic link

==== Linking to Assets ==== Use the ''asset()'' function:

===== Including Stylesheets and JavaScripts in Twig ===== Consider using [[http://symfony.com/doc/current/cookbook/assetic/asset_management.html|Assetic]]. With Twig, assuming you have the parent:



    
        {# ... #}
        {% block stylesheets %}
            
        {% endblock %}
        {# ... #}

in its child you can add to the assets defined in the parent:


{% extends 'base.html.twig' %}
{% block stylesheets %}
    {{ parent() }}
    
{% endblock %}
{# ... #}

You can also include assets located in your bundles' ''Resources/public'' folder. You will need to run ''php app/console assets:install target [--symlink]'', which moves (or symlinks) files into the correct location (target is by default "web".). ===== Global Template Variables ===== * ''app.user'': The current user object. * ''app.request'': The request object. * ''app.session'': The session object. * ''app.environment'': The current environment (dev, prod, etc). * ''app.debug'': True if in debug mode. False otherwise. ===== Configuring and Using the templating Service =====


return $this->render('article/index.html.twig');

is equivalent to:


use Symfony\Component\HttpFoundation\Response;

$engine = $this->container->get('templating');
$content = $engine->render('article/index.html.twig');

return $response = new Response($content);

It's preconfigured out of the box. Further config is in: framework: # ... templating: { engines: ['twig'] } ===== Overriding Bundle Templates ===== [[http://symfony.com/doc/current/book/templating.html#overriding-bundle-templates|The source]]. ==== Overriding Core Templates ==== [[http://symfony.com/doc/current/book/templating.html#overriding-core-templates|The source]]. ===== Three-level Inheritance ===== The three-template model is a best-practice method used by vendor bundles so that the base template for a bundle can be easily overridden to properly extend your application's base layout. - Create an ''app/Resources/views/base.html.twig'' file that contains the main layout for your application. Internally, this template is called ''base.html.twig''. - Create a template for each "section" of your site. {% extends 'base.html.twig' %} {% block body %}

Blog Application

{% block content %}{% endblock %} {% endblock %} - Create individual templates for each page and make each extend the appropriate section template.{% extends 'blog/layout.html.twig' %} {% block content %} {% for entry in blog_entries %}

{% endfor %} {% endblock %} ===== Output Escaping ===== ==== Output Escaping in Twig ==== Output escaping is on by default in Twig, so you're protected. By default, the output escaping assumes that content is being escaped for HTML output. To bypass escaping, use the raw filter: {{ article.body|raw }} You can also disable output escaping inside a ''{% block %}'' area or for an entire template. See [[http://twig.sensiolabs.org/doc/api.html#escaper-extension|Output Escaping]] in the Twig documentation. ==== Output Escaping in PHP ==== In PHP, output escaping is not automatic, meaning you'll need to manually ''escape()'' where necessary:


Hello escape($name) ?>  // HTML escapting by default
var myMsg = 'Hello escape($name, 'js') ?>'; // Specify context

===== Debugging ===== ''dump()'' is your friend. In PHP: namespace AppBundle\Controller; class ArticleController extends Controller { public function recentListAction() { $articles = ...; dump($articles); // ... } } In Twig: {{ dump(articles) }} {% for article in articles %} {{ article.title }} {% endfor %} To ''dump()'' in Twig, Twig's ''debug'' setting (in ''config.yml'') must be ''true'' (which is the case for ''dev'' but not ''prod''). ===== Syntax Checking ===== Check for syntax errors in Twig templates using the ''lint:twig'' console command:


# By filename:
$ php app/console lint:twig path/to/your_tempalte.html.twig

# By directory:
$ php app/console lint:twig app/Resources/views

===== Template Formats ===== Twig can render *any** format. * e.g.: XML ''article/index.xml.twig''. The ''name.format.twig'' naming format is a convention. Using the convention you can do:


public function indexAction(Request $request)
{
    $format = $request->getRequestFormat();
    return $this->render('article/index.'.$format.'.twig');
}

(See the [[http://symfony.com/doc/current/book/routing.html#advanced-routing-example|Advanced Example]] in Routing.) Create format links thus:



    PDF Version

Blog Application

{{ entry.title }}