Symfony框架之重写FOSUserBundle的默认模板

原文地址: http://symfony.com/doc/current/bundles/FOSUserBundle/overriding_templates.html

如果你在应用中使用了FOSUserBundle, 你势必会想办法去重写这个bundle提供的默认模板.
虽然模板的名称是不可配置的, 但是Symfony框架也为我们提供了两种重写模板的方式.

  1. app/Resources文件夹中定义一个同名模板文件.
  2. 创建一个继承了FOSUserBundle的bundle.

举例:重写默认的 layout.html.twig

推荐的做法是重写Resources/views/layout.html.twig模板, 这样能保证FOSUserBundle提供的页面能与你应用的页面风格保持一致. 下面是一个重写layout.html.twig的例子, 它包含了所有的重写选项.

FOSUserBundle提供的默认的layout.html.twig:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
</head>
<body>
<div>
{% if is_granted("IS_AUTHENTICATED_REMEMBERED") %}
{{ 'layout.logged_in_as'|trans({'%username%': app.user.username}, 'FOSUserBundle') }} |
<a href="{{ path('fos_user_security_logout') }}">
{{ 'layout.logout'|trans({}, 'FOSUserBundle') }}
</a>
{% else %}
<a href="{{ path('fos_user_security_login') }}">{{ 'layout.login'|trans({}, 'FOSUserBundle') }}</a>
{% endif %}
</div>

{% for type, messages in app.session.flashBag.all %}
{% for message in messages %}
<div class="{{ type }}">
{{ message|trans({}, 'FOSUserBundle') }}
</div>
{% endfor %}
{% endfor %}

<div>
{% block fos_user_content %}
{% endblock fos_user_content %}
</div>
</body>
</html>

如你所见, 它非常的简洁, 没有太多的结构, 所以你肯定会想用你应用中的布局文件来替换他. 在这个模板文件中主要要注意的地方就是名为fos_user_content的区块. 这是FOSUserBundle要在不同bundle的action中显示的内容, 所以你必须在你要重写的布局文件中包含这个区块.

下面的Twig模板是复写布局文件的例子.

1
2
3
4
5
{% block title %}Demo Application{% endblock %}

{% block content %}
{% block fos_user_content %}{% endblock %}
{% endblock %}

上面的例子继承了你的应用中的布局. content 区块是每个页面中显示内容的主要区域. 这就是为何fos_user_content 区块要包含在它里面的原因. 这将使FOSUserBundle的输出能够像预期的一样集成到应用的布局中去, 看上去像一个整体.

a)在app/Resources中创建一个新的模板文件

重写模板的最简单的方式是在你的app/Resources文件夹中创建一个新的模板. 为了重写FOSUserBundle文件夹中的Resources/views/layout.html.twig文件, 你应该将新的模板文件保存在app/Resources/FOSUserBundle/views/layout.html.twig

正如你看到的, 这种方式是在你的app/Resources目录中直接创建一个同名bundle的文件夹. 然后将你要重写的模板按照原来的目录结构保存在里面.

b)创建一个继承FOSUserBundle的bundle并且重写模板

这种方式相对上面的方式来说会复杂一些.除非你计划重写控制器以及模板, 不然还是使用另外一个方法比较好.

如上所述, 你可以创建一个FOSUserBundle的子bundle, 并且将要重写的模板保存在与FOSUserBundle相同的位置.首先要做的是在你的bundle类中重写getParent方法.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<?php
// src/Acme/UserBundle/AcmeUserBundle.php

namespace Acme\UserBundle;

use Symfony\Component\HttpKernel\Bundle\Bundle;

class AcmeUserBundle extends Bundle
{
public function getParent()
{
return 'FOSUserBundle';
}
}

通过你的bundle类中getParent方法返回的bundle的名称, 你可以告诉Symfony框架你的bundle是继承自FOSUserBundle的.

一旦你将你的bundle定义成了FOSUserBundle的子bundle, 你就可以重写父级bundle中的模板文件了. 若要重写布局文件, 只需要在src/Acme/UserBundle/Resources/views文件夹中创建一个名为layout.html.twig的文件. 注意此文件在bundle中的路径应该与在FOSUserBundle中的路径一样.

一旦在你的子bundle中重写了模板, 你就需要清理缓存, 即使是在开发环境中也要清理.

重写FOSUserBundle中其他的模板文件的方式跟此文中介绍的方式相同.