1. Twig Templating
John Rudolph Bautista
Software Engineer
The Twig logo is © Sensio Labs
October 26th 2013

2. PHP AS TEMPLATE

3. Why TWIG
WAS
born?

4. WAYBACK 2009

5. FABIEN potencier
- Symfony
- SwiftMailer
- Silex
- Pimple
- Twig
…. many more
https://github.com/fabpot

6. TWIG
The Twig logo is © Sensio Labs

7. Twig
- Provides Pattern Consistency
- Solves Complex Control Flow
- Template Inheritance & Macros
- Fully Extendable

8. Twig
- Well Documented
- Unit Tested
- Secure
- Fast (has a caching layer by default)

9. Syntax Highlighting

10. Installation

11. VIa Composer

12. VIA Composer
http://getcomposer.org/

13. VIA TARBALL OR ZIP
https://github.com/fabpot/Twig/tags
- Unpack
- Move files to your project folder

14. VIA GIT
https://github.com/fabpot/Twig/tags
git clone git://github.com/fabpot/Twig.git

15. USING TWIG API

16. Delimiters
{{ ... }}
- displays something
{% ... %}
- evaluates an expression (loops, tags, cond.)
{# ... #}
- comments code blocks

17. Twig Template FILE

18. Twig Template FILE
← Comment

19. Twig Template FILE
← FILTER

20. Twig Template FILE
← TAG

21. Twig Template FILE
← VARIABLE

22. Twig Template FILE
← FILTER WITH
ARGUments

23. THE BASICS

24. LITERALS
String = “Manong Johny”
Integer = 100000000
Float = 100000000.00
Array = [“pdaf”, “dap”]
Hash = {“key” : “value”}
Boolean = true/false
Null = null

25. SETTING VARIABLES
{% set str = 'value' %}
{% set arr = [1, 2, 3] %}
{% set hash = {'a' : 1, 'b': 2 } %}
{% set combine = ['a' : { 'b': 2 }] %}

26. PRINTING VARIABLES
{{ var }}
{{ var['elem'] }}
{{ var.elem }}
{{ var.prop }}

27. FILTERS
- Modifies a variable
- Uses “|” (pipe)
- Chainable
- Can accept arguments

28. FILTERS
{{ employee|title }}
Result : “Janet Napoles”
{{ tags|join(', ') }}
Result : “ph, rich, more fun”

29. MACROS
- acts like functions in regular
programming language
- default argument values are defined
by using the default() filter
- arguments are always optional

30. MACROS

31. ESCAPING
- escapes a string for safe insertion
into the final output
{{ var|escape }}
{{ var|e }}
{% autoescape %}
….
{% endautoescape %}

32. ESCAPING
Default Escape : {{ str|escape }}
<p>Hello World!</p>
JS Escape : {{ str|escape('js ') }}
x3Cpx3EHellox20Worldx21x3Cx2Fpx3E
CSS Escape : {{ str|escape('css ') }}
3C p3E Hello20 World21 3C 2F p3E
URL Escape: {{ str|escape('url') }}
%3Cp%3EHello%20World%21%3C%2Fp%3E

33. IF, ELSEIF, ELSE

34. FOR LOOP
- loop each item in a sequence

35. FOR LOOP

36. FOR WITH CONDITION

37. FOR LOOP VARIABLES

38. TEMPLATE
INHERITANCE

39. BLOCK
- are used for inheritance and act
as placeholders and replacements.
{% block content %}
…..
{% endblock %}

40. NAMED BLOCK END-TAGS

41. EXTENDS
- can be used to extend a template
from another one.
{% extends “layout.twig” %}

42. EXTENDS & BLOCK

43. EXTENDS & BLOCK

44. EXTENDS & BLOCK
{% block content %}
{% endblock content %}

45. INCLUDE
- includes a template and return
the rendered content of that file
into the current namespace.

46. INCLUDE

47. INCLUDE

48. DRUPAL
+
TWIG
Drupal 8 & Twig Road Map : http://lb.cm/twig

49. <THANK
YOU!