Symfony Templates Cookbook
Template tags
`{{ ... }} enclose variables. Object properties are referenced with dot notation: {{obj.prop}}. Functions can be put in tags too.
Filters can be applied with the pipe character: {{ title|upper }}.
{% ... %}` encloses logic.
<ul id="navigation">
{% for item in navigation %}
<li><a href="{{ item.href }}">{{ item.caption }}</a></li>
{% endfor %}
</ul>
{# ... #} encloses comments.[1]
Links
Linking to controllers: `{{ path("controler_name") }}, where "controler_name" is defined with the name attribute of a @Route`.
Headers and footers are located in base templates.
Child templates extend the base template to use the header and footers.[2]
A base template can contain default content. If the child template doesn't define a block that exists in the parent template, and the parent template contains default content in the block, the content from the parent template will be used.
Base template:
{# app/Resources/views/base.html.twig #}
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>{% block title %}Test Application{% endblock %}</title>
</head>
<body>
<div id="sidebar">
{% block sidebar %}
<ul>
<li><a href="/">Home</a></li>
<li><a href="/blog">Blog</a></li>
</ul>
{% endblock %}
</div>
<div id="content">
{% block body %}{% endblock %}
</div>
</body>
</html>
Child template:
{# app/Resources/views/Blog/index.html.twig #}
{% extends 'base.html.twig' %}
{% block title %}My cool blog posts{% endblock %}
{% block body %}
{% for entry in blog_entries %}
<h2>{{ entry.title }}</h2>
<p>{{ entry.body }}</p>
{% endfor %}
{% endblock %}
Extending a block in a child template
For example, a base template defines a core set of JavaScript and stylesheets for the site. A child template adds one stylesheet for a specific page on the site.
{# app/Resources/views/base.html.twig #}
{% block JavaScripts %}
<script src="{{ asset('js/core.js') }}"></script>
<script src="{{ asset('js/more.js') }}"></script>
{% endblock %}
{# app/Resources/views/child.html.twig #}
{% block JavaScripts %}
{{ parent() }}
<script src="{{ asset('js/child.js') }}"></script>
{% endblock %}
Conditional blocks
Render the paragraph tags only if there is content to be displayed:
{% block teaser %}
{% if teaser_text|trim is defined %}
<p>{{ teaser_text }}</p>
{% endif %}
{% endblock %}
NB There may be better ways of accomplishing this, but this method does work.
Including other templates
Templates are included using the `{{ include() }}` function.[3]
{{ include('Article/articleDetails.html.twig', { 'article': article }) }}
Creating custom Twig filters and functions
Create a class that holds the methods defining the filters and/or functions, then register that class as a Symfony service.[4]
The extension class:
// src/AppBundle/Twig/AppExtension.php
namespace AppBundle\Twig;
class AppExtension extends \Twig_Extension
{
public function getFilters()
{
return array(
new \Twig_SimpleFilter('price', array($this, 'priceFilter')),
);
}
public function priceFilter($number, $decimals = 0, $decPoint = '.', $thousandsSep = ',')
{
$price = number_format($number, $decimals, $decPoint, $thousandsSep);
$price = '$'.$price;
return $price;
}
public function getName()
{
return 'app_extension';
}
}
getName()should return a unique identifier.- Filters are registered in
getFilters(). - Functions are registered in
getFunctions().
Registering the class as a service:
# app/config/services.yml
services:
app.twig_extension:
class: AppBundle\Twig\AppExtension
public: false
tags:
- { name: twig.extension }
Now any filter or function registered in the extension class can be used in Twig templates, e.g. Template:Product.total.
Notes
- ↑ Creating and Using Templates, Symfony documentation
- ↑ Template Inheritance and Layouts, Symfony documentation
- ↑ Including Other Templates, Symfony template documentation
- ↑ How To Write a Custom Twig Extension, Symfony documentation