A presentation I gave at the Utah Drupal Users Group meeting on 7/28.

1. Twig+Drupal8
Logan Farr 07.28.16

2. WhatisTwig?
“A modern template engine
for PHP”
Part of the Symfony2
framework
Clean syntax
Requires PHP 5.2.7+
PHP API

3. UsingTwig

4. UsingTwig-Templates
TemplatesfollowsameconventionasinDrupal7,justinsteadof.tpl.php,theyarenow.html.twig
page.html.twig
page--node.html.twig
page--node--1.html.twig

5. UsingTwig-Variables,Comments,andArrays
{# A comment #}
{# Set a variable #}
{% set foo = ‘bar’ %}
{# Set an array #}
{% set foo = [1,2] %}
{{ variable.property }}

6. UsingTwig-Filters
{{ variable|filter }}
{% set name = “Logan” %}
{{ name|lower }} => “logan”
{{ name|upper }} => “LOGAN”
abs
batch
capitalize
convert_encoding
date
date_modify
default
escape
first
format
join
json_encode
keys
last
length
lower
merge
nl2br Converts n to <br />
number_format
raw
replace
reverse
round
slice
sort
split
striptags
title
trim
upper
url_encode

7. UsingTwig-DrupalFilters
{{ ‘String’|t }} ⇔ t()
{{ ‘<p>Paragragh</p>’|placeholder }}
GetsescapedtoHTMLandformattedusingdrupal_placeholder()
Note:Donotpassvariablesintothesefilters,itisunsafe.Thisnotonlyinflatesthelistofstringsfor
translationbutisalsoapotentialvulnerability,particularlyiftheoutputcanbeenteredbyauser.

8. UsingTwig-Functions
{{ function(arg1, arg2) }}
{{ max(1, 3, 2) }} => Outputs 3
{{ date(formattedDate) }} => Outputs timestamp
Note:formattedDatemustbeinoneofPHP’ssupporteddateformats
attribute
block
constant
cycle
date
dump
include
max
min
parent
random
range
source

9. UsingTwig-DrupalFunctions
https://www.drupal.org/node/2486991 url(name, parameters, options)
path(name, parameters, options)
link(text, url, attributes)
file_url(uri)
attach_library(library)

10. FromPHPtoTwig

11. FromPHPtoTwig
Similar to D7 theming--pass tings into the $variables[] array
from a preprocessing function.
function hook_preprocess_page(&$variables) {
$variables[‘title’] = ‘Come to the dark side.’;
$variables[‘page_class’] = ‘page-dark-side’;
}
{{ title }}
{{ page_class }}

12. DebuggingTwigVariables

13. DebuggingTwigvariables
Insites/*/settings.php:
$settings['container_yamls'][] = __DIR__ . '/services.yml';
Insites/*/services.yml:
parameters:
twig.config:
debug: true

14. DebuggingTwigvariables
<?php
$array = new array(1, 2);
var_dump($array);
dpm($array);
{% set array = [1,2] %}
{{ dump(array) }}
{{ kint(array) }}
Note:YoumusthaveTwigdebuggingenabled

15. DebuggingTwigVariables-DumpingValues
ToprintaTwigvariable,simplyencaseitin {{}}
{{ variable }}
Youcanusedump()todumpthevariableintoyourtemplatefile
{{ dump(variable) }}
Toseeallavailablevariables,use {{ dump() }}
Alternatively,usekint() toseea“nice”print-out

16. ● Return render arrays
from preprocessing
functions
● Call filters and
functions from template
files
See more:
https://www.drupal.org/node/1920746
BestPractices

17. Yay,Twig!