Drupal 7's theme layer suffered from "Arrays of Doom" and the impenetrable render(). After having to learn and use these tools, the community has rebelled and decided we need to make some major changes in Drupal 8. Come learn about Twig, a new Symfonic templating language we can use to decrease Drupal's learning curve and increase security on every Drupal site.

1. A NEW THEME LAYER
FOR DRUPAL 8
Jen Lampton ~ @jenlampton
Carl Wiedemann ~ @c4rl
Saturday, July 21, 2012

2. WHO ARE WE?
Saturday, July 21, 2012

3. I AM c4rl
(Carl Wiedemann)
working with Drupal (since D5)
training instructor (since D6)
drupal.org redesign team
I care a lot about _?_
Saturday, July 21, 2012

4. I AM jenlampton
(Jen Lampton)
working with Drupal (since D4.7)
training instructor (since D6)
conrib maintainer (youtube, more) since D5
I care a lot about usability & learnability
Saturday, July 21, 2012

5. WHO ARE YOU?
Saturday, July 21, 2012

6. YOU ARE:
Theme developers?
(D7? D6? D5?)
Saturday, July 21, 2012

7. YOU ARE:
Theme developers?
(D7? D6? D5?)
New to Drupal?
(just want to know what the heck is going on in D8)
Saturday, July 21, 2012

8. YOU ARE:
Theme developers?
(D7? D6? D5?)
New to Drupal?
(just want to know what the heck is going on in D8)
Drupal Experts?
(also want to know what the heck is going on in D8)
Saturday, July 21, 2012

9. DRUPAL 8 :
A NEW THEME LAYER
Saturday, July 21, 2012

10. DRUPAL 8 :
A NEW THEME LAYER
(probably)
Saturday, July 21, 2012

11. WHY?
Saturday, July 21, 2012

12. DRUPAL 7
(remember how some of you said that you had
built themes for Drupal 7?)
Saturday, July 21, 2012

13. DRUPAL 7: POSITIVE
Saturday, July 21, 2012

14. DRUPAL 7: POSITIVE
flexible
Saturday, July 21, 2012

15. DRUPAL 7: POSITIVE
unified data structures everywhere
Saturday, July 21, 2012

16. DRUPAL 7: POSITIVE
anyone?
Saturday, July 21, 2012

17. DRUPAL 7: NEGATIVE
Saturday, July 21, 2012

18. DRUPAL 7: NEGATIVE
Drupal only (weird) syntax
Saturday, July 21, 2012

19. DRUPAL 7: NEGATIVE
Object or Array?
Saturday, July 21, 2012

20. DRUPAL 7: NEGATIVE
print or print render() ?
Saturday, July 21, 2012

21. DRUPAL 7: NEGATIVE
complex mix of subsystems
Saturday, July 21, 2012

22. DRUPAL 7: NEGATIVE
PHP is insecure
Saturday, July 21, 2012

23. DRUPAL 7: NEGATIVE
Too many template files
Saturday, July 21, 2012

24. DRUPAL 7: NEGATIVE
prone to bugs
Saturday, July 21, 2012

25. DRUPAL 7: NEGATIVE
Drupal 7 is too hard to learn!
Saturday, July 21, 2012

26. DRUPAL 8
what do we want?
Saturday, July 21, 2012

27. DRUPAL 8
what do we want?
Something proudly found elsewhere
Saturday, July 21, 2012

28. DRUPAL 8
what do we want?
Objects
Saturday, July 21, 2012

29. DRUPAL 8
what do we want?
Objects
(but not in the templates)
Saturday, July 21, 2012

30. DRUPAL 8
what do we want?
Secure
Saturday, July 21, 2012

31. DRUPAL 8
what do we want?
The right templates
Saturday, July 21, 2012

32. DRUPAL 8
what do we want?
Consistency
Saturday, July 21, 2012

33. TWIG
Saturday, July 21, 2012

34. TWIG
A modern template engine for PHP.
http://twig.sensiolabs.org
Saturday, July 21, 2012

35. TWIG
what’s so great about it?
• well documented
• extensible
• secure
• well tested
• IDE integration
• recognizable syntax
• Python (django)
• JS (TwigJS)
•Ruby (Liquid)
•by Symfony’s author, Fabien Potencier
Saturday, July 21, 2012

36. TWIG
what does it look like?
Saturday, July 21, 2012

37. TWIG
what does it look like?
print with {{ }}
Saturday, July 21, 2012

38. TWIG
what does it look like?
commands with {% %}
Saturday, July 21, 2012

39. TWIG
what does it look like?
comments with {# #}
Saturday, July 21, 2012

40. TWIG
what does it look like?
simple and intuitive
Saturday, July 21, 2012

41. INTERLUDE:
attributes
attributes are messy
Saturday, July 21, 2012

42. INTERLUDE:
attributes
HTML5 attribute types:
String
Boolean
Enumerated
attributes are messy
Saturday, July 21, 2012

43. INTERLUDE:
attributes
We need attributes to be “drillable”
attributes
or
attributes.class
or
attributes.id
Saturday, July 21, 2012

44. INTERLUDE:
attributes
PHP5 to the rescue!
ArrayAccess
allows objects to be treated as arrays
__toString
allows “flattening” of arrays or objects into HTML strings
(almost)
Saturday, July 21, 2012

45. INTERLUDE:
attributes
but, this has nothing to do with TWIG.
so
let’s do it now:
http://drupal.org/node/1290694
Saturday, July 21, 2012

46. TWIG
how would it work?
all theme functions become template files.
a single way to override markup!
Saturday, July 21, 2012

47. TWIG
D7
D8
theme_username becomes username.twig
Saturday, July 21, 2012

48. TWIG
D7
D8
theme_image becomes image.twig
Saturday, July 21, 2012

49. TWIG
D7
D8
theme_link becomes link.twig
Saturday, July 21, 2012

50. TWIG
D7 D8
theme_item_list beomes item_list.twig
Saturday, July 21, 2012

51. TWIG
how would it work?
D7 D8
more like Drupal 6!
Saturday, July 21, 2012

52. TWIG
how would it work?
there’s a lot we still don’t know.
Saturday, July 21, 2012

53. TWIG
why is this good?
Saturday, July 21, 2012

54. TWIG
why is this good?
remember the complexity of Drupal 7?
Saturday, July 21, 2012

55. TWIG
why is this good?
look what would happen in Drupal 8.
Saturday, July 21, 2012

56. TWIG
where does this fit in with SCOTCH?
The “Blocks everywhere” initiative complicates things
Saturday, July 21, 2012

57. TWIG
where does this fit in with SCOTCH?
Blocks in D6 (in red)
Saturday, July 21, 2012

58. TWIG
where does this fit in with SCOTCH?
Blocks in D7 (in red)
Saturday, July 21, 2012

59. TWIG
where does this fit in with SCOTCH?
Blocks in D8 (in red)
Saturday, July 21, 2012

60. TWIG
while we’re at it...
...let’s clean up the template files!
Saturday, July 21, 2012

61. TWIG
“Learnability”
- Easier to learn than PHP
- Consistent
- Secure
Saturday, July 21, 2012

62. DISCUSS!
Saturday, July 21, 2012

63. A NEW THEME LAYER
FOR DRUPAL 8
@jenlampton | http://www.jenlampton.com
@c4rl | http://www.c4rl.ws
Saturday, July 21, 2012

64. photo credits:
lolcat-wut:
http://www.funnyjunk.com/funny_pictures/1152056/Dude/
lolcat-flexible
http://icanhascheezburger.com/2008/10/24/funny-pictures-fexlibility-i-haz-it/
lolcat questionmark
http://icanhascheezburger.com/2007/10/31/11197/
questionmark
http://fr.wikipedia.org/wiki/Fichier:Question_mark_3d.png
wheel-reinvented
http://www.brainwads.net/drewhawkins/2012/01/dont-re-invent-the-wheel-make-something-better/
objects
http://2teachers1classroom.blogspot.com/2009_02_01_archive.html
shapes
http://englishclass.jp/reading/topic/For_Screening_Purposes_Only
secure
http://blog.stratepedia.org/2010/06/03/what-is-a-secure-site/
consistency
http://icsigns.org/press/2010/03/23/consistency-staying-on-the-mark/
twig bird comic
http://s302.photobucket.com/albums/nn105/walkseva/?action=view&current=thebirdneedsthattwig.gif&currenttag=bird%20park%20twig%20comic%20need%20it
scotch
http://www.thespir.it/articles/scotch-101/?viewall=1
twig
http://galletly.blogspot.com/2009/10/twig.html
Saturday, July 21, 2012