前述内容针对blog应用程序创建了 视图和URL,下面将添加模板,并以用户友好的方式显示帖子.
接下来,在blog应用程序目录中创建下列目录和文件:
上述结构将表示模板的文件结构.其中base.html文件包含了站点的HTML主结构,并将内容划分为主内容区域和侧栏.list.html和detail.html文件继承自base.html,分别用于渲染博客帖子列表以及详细视图.
Django包含了功能强大的模板语言,并可确定数据的显示方式.该语言基于模板标签、模板变量以及模板过滤器,如下所示:
- 模板标签负责控制模板的渲染,形如{%tag%}.
- 当模板被渲染时,模板变量被替换为对应值,形如{{ variable }}
- 模板过滤器可针对显示调整变量,形如{{ variable|filter }}
下面编辑base.html文件并添加以下内容:
{% load static %} <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>{% block title %}{% endblock %}</title> </head> <body> <div id="content"> {% block content %} {% endblock %} </div> <div id="sidebar"> <h2>My blog</h2> <p>This is my blog.</p> </div> </body> </html>
其中,{% load static%}通知django加载django.contrib.staticfiles应用程序提供的静态模板标签,该标签位于INSTALLED_APPS设置项中.待加载完毕后,可在模板中使用{% static %}模板过滤器.根据这一模板过滤器,即可包含静态文件,如blog.css文件(改文件位于blog应用程序的static/目录下).
此处还存在两个{% block %}标签,此类标签通知Django,需要在该区域内定义一个块.继承自该模板的模板将利用相关内容填充该块.此处分别定义了title块和content块.
下面编辑post/list.html文件:
{% extends "blog/base.html" %} {% block title %}My Blog{% endblock %} {% block content %} <h1>My Blog</h1> {% for post in posts %} <h2> <a href="{{ post.get_absolute_url }}">{{ post.title }}</a> </h2> <p class="date"> Published {{ post.publish }} by {{ post.author }} </p> {{ post.body|truncatewords:30|linebreaks }} {% endfor %} {% endblock %}
根据{% extends %}模板标签,将通知Django继承blog/base.html模板.随后将填充基模板的title和content块.接下来遍历帖子,并显示标题、日期、作者、主体内容,还包括标题中指向帖子标准URL的连接.在帖子的主体内容中,可使用两个模板过滤器.其中,truncatewords将数值截取至特定的单词数量;linebreaks将输出结果转换为HTML换行符.当然,我们可以链接任意数量的模板过滤器,每个过滤器都将应用于前一个过滤器生成的输出结果中.
打开Shell冰之心python manage.py runserver命令,以启动开发服务器.在浏览器中,输入http:127.0.0.1:8000/blog即可看到当前运行状态.需要注意的是,此处需要设置一个包含published状态的帖子,以对其加以显示.对应下图:
接下来开始编辑post/detail.html文件,如下所示:
{% extends "blog/base.html" %} {% block title %}{{ post.title }}{% endblock %} {% block content %} <h1>{{ post.title }}</h1> <p class="date"> Published{{ post.publish }} by {{ post.author }} </p> {{ post.body|linebreaks }} {% endblock %}
随后可返回至浏览器中,单击帖子标题以查看帖子的详细视图,如图: