我打算用django创建一个网站,整个网站都有一个共同的标题.我已经阅读了django关于模板继承的文档,但我似乎无法找到一个优雅的解决方案,用于标题中的"动态"元素.
例如,网站中的标题将包含标签,类似于http://www.google.com/(其中包含"网络","图片"等),其中所选标签将描述您当前的位置网站.
使用django模板继承,看起来你会像这样创建一个基本模板:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<link rel="stylesheet" href="style.css" />
<title>{% block title %}My Amazing Site{% endblock %}</title>
</head>
<body>
<div id="header">
{% block header %}
.... html to create tabs ...
{% endblock header %}
</div>
然后在我的所有其他页面中,我会这样做:
{% extends "base.html" %}
{% block header % }
.... html to create tabs with one tab "selected" ...
{% endblock header %}
这看起来很烦人,因为我的每个页面都必须有标题信息的重复HTML,但略有不同.因此,当需要添加新选项卡时,我必须修改每个HTML文件.
在进一步阅读时,似乎其他一些可能的解决方案是:
1 - 创建一个自定义模板标记,其中包含当前选中的选项卡,在我刚调用的每个HTML页面中都采用这种方式:{%block header%} {%mycustomtag abc%} {%endblock header%}
我不喜欢这个解决方案,因为它需要将HTML放入python代码中来创建这个自定义标记.
2 - 创建X数量的base.html子模板,所有子模板都选中了相应的选项卡.然后,每个页面将根据他们想要选择的选项卡从相应的子模板继承.
这个解决方案看起来很好,除了它需要X数几乎完全相同的HTML,并且仍然遇到在添加或删除选项卡时必须修改所有文件的问题.
3 - 使用javascript(如jquery)修改页面加载时的标题以"选择"正确的选项卡.
这个解决方案很好,但是需要记住将这个功能添加到每个页面的javascript中.好的部分是标题HTML只存在于一个HTML文件中.
还有其他建议吗？
谢谢!
我假设每个选项卡都是模板中的列表项base.html.
<ul>
<li>Tab 1</li>
<li>Tab 2</li>
...
</ul>
为每个添加一个额外的块li.
<ul>
<li class="{% block class_tab1 %}inactive{% endblock %}">Tab 1</li>
<li class="{% block class_tab2 %}inactive{% endblock %}">Tab 2</li>
<li class="{% block class_tab3 %}inactive{% endblock %}">Tab 3</li>
...
</ul>
然后在模板中选择选项卡1:
{% extends "base.html" %}
{% block class_tab1 %}active{% endblock %}
...
所以为Tab 1呈现的html是:
<ul>
<li class="active">Tab 1</li>
<li class="inactive">Tab 2</li>
<li class="inactive">Tab 3</li>
...
</ul>
你可以li .active根据自己的意愿编写CSS来定位.
| 归档时间： |
|
| 查看次数： |
3884 次 |
| 最近记录： |