overriding_templates.rst 6.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160
  1. Overriding Default FOSUserBundle Templates
  2. ==========================================
  3. As you start to incorporate FOSUserBundle into your application, you will probably
  4. find that you need to override the default templates that are provided by
  5. the bundle. Although the template names are not configurable, the Symfony
  6. framework provides two ways to override the templates of a bundle.
  7. 1. Define a new template of the same name in the ``app/Resources`` directory
  8. 2. Create a new bundle that is defined as a child of ``FOSUserBundle``
  9. Example: Overriding The Default layout.html.twig
  10. ------------------------------------------------
  11. It is highly recommended that you override the ``Resources/views/layout.html.twig``
  12. template so that the pages provided by the FOSUserBundle have a similar look and
  13. feel to the rest of your application. An example of overriding this layout template
  14. is demonstrated below using both of the overriding options listed above.
  15. Here is the default ``layout.html.twig`` provided by the FOSUserBundle:
  16. .. code-block:: html+jinja
  17. <!DOCTYPE html>
  18. <html>
  19. <head>
  20. <meta charset="UTF-8" />
  21. </head>
  22. <body>
  23. <div>
  24. {% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
  25. {{ 'layout.logged_in_as'|trans({'%username%': app.user.username}, 'FOSUserBundle') }} |
  26. <a href="{{ path('fos_user_security_logout') }}">
  27. {{ 'layout.logout'|trans({}, 'FOSUserBundle') }}
  28. </a>
  29. {% else %}
  30. <a href="{{ path('fos_user_security_login') }}">{{ 'layout.login'|trans({}, 'FOSUserBundle') }}</a>
  31. {% endif %}
  32. </div>
  33. {% for type, messages in app.session.flashBag.all %}
  34. {% for message in messages %}
  35. <div class="{{ type }}">
  36. {{ message|trans({}, 'FOSUserBundle') }}
  37. </div>
  38. {% endfor %}
  39. {% endfor %}
  40. <div>
  41. {% block fos_user_content %}
  42. {% endblock fos_user_content %}
  43. </div>
  44. </body>
  45. </html>
  46. As you can see its pretty basic and doesn't really have much structure, so you will
  47. want to replace it with a layout file that is appropriate for your application. The
  48. main thing to note in this template is the block named ``fos_user_content``. This is
  49. the block where the content from each of the different bundle's actions will be
  50. displayed, so you must make sure to include this block in the layout file you will
  51. use to override the default one.
  52. The following Twig template file is an example of a layout file that might be used
  53. to override the one provided by the bundle.
  54. .. code-block:: html+jinja
  55. {% extends 'layout.html.twig' %}
  56. {% block title %}Demo Application{% endblock %}
  57. {% block content %}
  58. {% block fos_user_content %}{% endblock %}
  59. {% endblock %}
  60. This example extends the layout template from the layout of your app. The
  61. ``content`` block is where the main content of each page is rendered. This
  62. is why the ``fos_user_content`` block has been placed inside of it. This
  63. will lead to the desired effect of having the output from the FOSUserBundle
  64. actions integrated into our applications layout, preserving the look and
  65. feel of the application.
  66. **a) Define New Template In app/Resources**
  67. The easiest way to override a bundle's template is to simply place a new one in
  68. your ``app/Resources`` folder. To override the layout template located at
  69. ``Resources/views/layout.html.twig`` in the ``FOSUserBundle`` directory, you would place
  70. your new layout template at ``app/Resources/FOSUserBundle/views/layout.html.twig``.
  71. As you can see the pattern for overriding templates in this way is to
  72. create a folder with the name of the bundle class in the ``app/Resources`` directory.
  73. Then add your new template to this folder, preserving the directory structure from the
  74. original bundle.
  75. **b) Create A Child Bundle And Override Template**
  76. .. note::
  77. This method is more complicated than the one outlined above. Unless you are
  78. planning to override the controllers as well as the templates, it is recommended
  79. that you use the other method.
  80. As listed above, you can also create a bundle defined as child of FOSUserBundle
  81. and place the new template in the same location that is resides in the FOSUserBundle.
  82. The first thing you want to do is override the ``getParent`` method to your bundle
  83. class.
  84. .. code-block:: php
  85. <?php
  86. // src/Acme/UserBundle/AcmeUserBundle.php
  87. namespace Acme\UserBundle;
  88. use Symfony\Component\HttpKernel\Bundle\Bundle;
  89. class AcmeUserBundle extends Bundle
  90. {
  91. public function getParent()
  92. {
  93. return 'FOSUserBundle';
  94. }
  95. }
  96. By returning the name of the bundle in the ``getParent`` method of your bundle class,
  97. you are telling the Symfony Framework that your bundle is a child of the FOSUserBundle.
  98. Now that you have declared your bundle as a child of the FOSUserBundle, you can override
  99. the parent bundle's templates. To override the layout template, simply create a new file
  100. in the ``src/Acme/UserBundle/Resources/views`` directory named ``layout.html.twig``. Notice
  101. how this file resides in the same exact path relative to the bundle directory as it
  102. does in the FOSUserBundle.
  103. After overriding a template in your child bundle, you must clear the cache for the override
  104. to take effect, even in a development environment.
  105. Overriding all of the other templates provided by the FOSUserBundle can be done
  106. in a similar fashion using either of the two methods shown in this document.
  107. Configuring A Templating Engine Other Than Twig
  108. -----------------------------------------------
  109. You can configure a templating engine other than Twig using the bundle's configuration.
  110. Below is an example configuration for using the PHP templating engine.
  111. .. code-block:: yaml
  112. fos_user:
  113. # ...
  114. template:
  115. engine: php
  116. The FOSUserBundle only provides default templates for the Twig templating engine,
  117. so you will have to create all of the templates that you are using. The names and
  118. locations will be the same except that the file extension will be ``.php`` instead of
  119. ``.twig``
  120. .. note::
  121. This feature is considered as deprecated and will be removed in FOSUSerBundle 2.0.