TYPO3 Template Engine Integration Explained

TYPO3 Template Engine Integration Explained

When it comes to rendering content, TYPO3 is extremely flexible. You have to search a long time for a system that offers something comparable. With TypoScript and Fluid, we have endless possibilities to render the content exactly as we need it.

We take a closer look at what is normally taken for granted. How does TYPO3 render content and what possibilities do we have to customize it? This talk is not about how to write especially nice fluid templates. You will learn how the Fluid-Template Engine is integrated into TYPO3 and how to integrate your own Template Engine into TYPO3. We will integrate Twig because we can.

D16de7219f9aafbb6f83eff20ba86229?s=128

Benjamin Kott

August 01, 2019
Tweet

Transcript

  1. TEMPLATE ENGINE INTEGRATION TYPO3 info@typo3.com @typo3 August 1st, 2019 Karlsruhe,

    Germany
  2. BENJAMIN KOTT  Developer Advocate  Consultant  UI/UX Lead

    @benjaminkott benjamin.kott@typo3.com
  3. WARNING: THERE WILL BE CODE! I WILL SPEAK FAST! IT

    WILL BE RECORDED! QUESTIONS AT THE END!
  4. 1. Engine Definition 2. Examples 3. Portability 4. Integration 5.

    Twig in TYPO3 6. Summary 7. Q&A
  5. DEFINITION A template engine is software designed to combine templates

    with a data model to produce result documents. The language that the templates are written in is known as a template language or templating language. A template engine is ordinarily included as a part of a web template system or application framework and may be used also as a preprocessor or filter. - Wikipedia - https://en.wikipedia.org/wiki/Template_processor
  6. None
  7. None
  8. None
  9. Blade Laravel Twig Symfony Fluid TYPO3

  10. IMAGINE TYPO3 WOULD USE TWIG…

  11. IMAGINE YOU COULD NOW SHARE TEMPLATES BETWEEN YOUR PATTERNLAB, SYMFONY,

    DRUPAL AND TYPO3!
  12. YOUR FAVORITE TEMPLATE ENGINE IS NOT AS PORTABLE AS YOU

    MAY THINK.
  13. FLAVORED ENGINES SYSTEM SPECIFIC FUNCTIONS

  14. TWIG Tags apply autoescape block deprecated do embed extends flush

    for from if import include macro sandbox set use verbatim With Filters abs batch capitalize column convert_encoding date date_modify default escape filter first format inky inline_css join json_encode keys last length lower map markdown merge nl2br number_format raw reduce replace reverse round slice sort spaceless split striptags title trim upper url_encode Functions attribute block constant cycle date dump include max min parent random range source template_from_string Tests constant defined divisibleby empty even iterable null odd sameas
  15. TWIG – SYMFONY Tags form_theme stopwatch trans trans_default_domain Transchoice Filters

    abbr_class abbr_method file_excerpt file_link file_relative format_args format_args_as_text format_file format_file_from_text humanize trans transchoice yaml_dump yaml_encode Functions absolute_url asset asset_version controller csrf_token expression form form_end form_errors form_help form_label form_rest form_row form_start form_widget is_granted logout_path logout_url path relative_path render render_esi url Tests rootform selectedchoice
  16. TWIG – DRUPAL Filter t trans placeholder drupal_escape safe_join without

    clean_class clean_id render format_date Functions render_var url path link file_url attach_library active_theme_path active_theme create_attribute
  17. SYMFONY TWIG != DRUPAL TWIG

  18. YOU CAN NOT REUSE YOUR TEMPLATES OUTSIDE THE SYSTEM THEY

    HAVE BEEN BUILT FOR. FLAVOR AND NECESSARY EXTENSIONS ARE DESTROYING PORTABILITY.
  19. WHAT WOULD BREAK?  Text formatting  Date strings 

    Forms  Links  Images  Media … anything that is flavored.
  20. TYPO3 RENDERING

  21. None
  22. None
  23. None
  24. None
  25. FLUIDTEMPLATE IS A TYPOSCRIPT EXTENSION

  26. None
  27. None
  28. None
  29. JUST RETURN A STRING

  30. EXTBASE

  31. EXTBASE DEFAULT VIEWS  TYPO3\CMS\Extbase\Mvc\View\EmptyView  TYPO3\CMS\Extbase\Mvc\View\JsonView  TYPO3\CMS\Extbase\Mvc\View\NotFoundView Extbase

    does not ship a FluidView
  32. None
  33. None
  34. YOU CANNOT CHANGE THE DEFAULT VIEW FOR EVERYTHING. THAT’S A

    GOOD THING!
  35. None
  36. YOU CAN CHANGE IT FOR YOUR OWN EXTENSIONS TO ANY

    VIEW YOU WANT, AS LONG IT IS IMPLEMENTING THE VIEWINTERFACE.
  37. EVERYONE ELSE IS ON ITS OWN. JUST RETURN A STRING.

  38. LET´S ADD TWIG TO THE STACK.

  39. ADDING TWIG 1. Register new cObject 2. Build a new

    StandaloneView 3. Build a new ExtbaseView 4. Implement Twig 5. Rebuild Page 6. Rebuild Content Elements 7. Rebuild all the Flavor
  40. None
  41. None
  42. None
  43. None
  44. None
  45. None
  46. None
  47. None
  48. CACHE USING THE TYPO3 CACHING FRAMEWORK

  49. None
  50. None
  51. None
  52. None
  53. None
  54. LOADER TEMPLATES, PARTIALS, LAYOUTS AND MORE

  55. None
  56. None
  57. None
  58. None
  59. None
  60. ONLY THE TWIG FILESYSTEM-LOADER HAS SUPPORT FOR NAMESPACES

  61. None
  62. None
  63. None
  64. None
  65. CONNECTING EVERYTHING

  66. None
  67. None
  68. EXTENSIONS

  69. None
  70. None
  71. 120 FILES AND 5,600 LINES OF CODE LATER

  72. None
  73. None
  74. None
  75. None
  76. CONCLUSION

  77. LEARNINGS  Any Template Engine possible  Multiple Template Engines

    at once  Easy to implement it yourself
  78. QUESTIONS? BENJAMIN KOTT @benjaminkott benjamin.kott@typo3.com

  79. THANK YOU