De presentatie over de template engine Twig.

1. twig

2. Wat is twig?
●een template framework dat PHPTemplate vervangt
●ontwikkeld door de mensen achter Symfony
●wordt gebruikt door de grotere PHP community
●OOP in het achterhoofd gehouden

3. Waarom twig?
●PHPTemplate is verouderd
●twig is sneller
●duidelijk en netter/korter.
●gemakkelijker om te leren
●gedocumenteerd
●veilig
●uitbreidbaar

4. Hoe ziet het er uit?

5. File en functie namen
theme_node() node.html.twig
Functie namen
page.tpl.php page.html.twig
File namen

6. Tags (block delimiters)
1. {{ deze }}
2. {% deze %}
3. {# deze #}
zeggen iets
doen iets
zijn voor comments

7. Tags (block delimiters)
{{ deze }} printen variabelen

8. Tags (block delimiters)
{% deze %} behandelen logica

9. Tags (block delimiters)
{# deze #} maken comments

10. Variabelen
variabele printen
hash key item printen
variabele maken
array maken
<div>{{ content }}</div>
{{ item[‘#item’] }}
{% set var = content.title %}
{% set var = [ ‘foo’: ‘foo’, ‘bar’:
‘bar’ ] %}

11. Variabelen
item toevoegen aan bestaande array:
{% set arr = arr|merge({'element': 'value'}) %}

12. Conditionals (if)
{% if content.comments %} {% endif %}
{% if content.comments is not empty %} {% endif %} // !empty()
{% if content.comments is defined %} {% endif %} // isset()
{% if var > 0 %} {% endif %}

13. Control structures
foreach ($users as $user) {}
in twig is dit
{% for user in users %} {% endfor %}

14. Filters
abs
batch
capitalize
convert_encoding
date
date_modify
default
escape
first
format
join
json_encode
keys
last
length
lower
merge
nl2br
number_format
raw
replace
reverse
round
slice
sort
split
striptags
title
trim
upper
url_encode

15. Filters
Filters staan bij de variabele die geprint wordt en worden
geïdentificeerd door een “|” (pipe)

16. Filters

17. Punt notatie
Twig gebruikt punt notatie (.) om attributen van variabelen
aan te spreken. Dit geldt ook voor properties van objecten en
voor items van arrays.
Naast de punt notatie is er ook de subscript syntax, handig
voor properties met een hash (#).
{{ foo.bar }} {{ foo[‘#bar’] }}

18. Wanneer een attribuut een speciaal karakter heeft (zoals
een liggend streepje dat als een min-operator
geïnterpreteerd wordt), gebruiken we de attribute functie:
{# equivalent van {{ foo.bar-data }} #}
{{ attribute(foo, ‘bar-data’) }}

19. Overerving
Templates kunnen erven van elkaar.
De originele template definieert een block dat overschreven
kan worden.
De ervende template roept het origineel aan en overschrijft
het blok.

20. Overerving
Voorbeeld uit core themes Classy en Bartik:
Classy definieert een blok in /templates/block/block--
search-form-block.html.twig

21. en gebruikt {{ parent() }} om de originele content te printen.
Bartik roept de Classy template aan en voegt code toe aan het block in /templates/block/block--
search-form-block.html.twig

22. Assets toevoegen

23. Debugging
locatie:
sites/default/services.yml
Zet debug: true

24. Debugging
●templates automatisch opnieuw gecompileerd
●toont handige comments in html
●laat toe de dump() functie te gebruiken
Doe dit NIET in productie!

25. Debugging
Debug output:

26. Debugging
Debug() kan vastlopen wanneer er veel variabelen zijn.
Alternatief: kint()
drush dl devel
drush en kint

27. Debugging
Gebruik {{ kint() }}
ipv {{ dump() }}

28. Documentatie
http://twig.sensiolabs.org
http://www.drupal.org/theme-guide/8