| 本渣渣不专注技术，只专注使用技术，不是一个资深的coder，是一个不折不扣的copier |
在 Django个人博客开发九 | 整理项目结构 结构梳理章节已经分析过了，分类页面、归档页面、标签页面都是都是一样的，只是路由不一样而已
所以这里以 生活笔记、关于自己为例讲解这一类页面
1、渲染分类页面数据
首先制作一个四区模板，也即文章列表模块
在 blog -> templates 中新建文件 content.html
生活笔记分类
blog -> templates -> content.html
{%extends 'base_right.html'%}
{% block description %}
<meta name="description" content="{% get_title category as c %}{{ c.description }}"/>
{% endblock description %}
{% block keywords %}
<meta name="keywords" content="{% get_title category as c %}{{ c.keywords }}"/>
{% endblock keywords %}
{% block title %}{% get_title category as c %}静觅丨{{ c.name }}{% endblock title %}
{% block body %}
<div class="content-wrap">
<div class="content">
<header class="archive-header">
<h1><i class="fa fa-folder-open"></i> 分类：{{ category }}
<a title="订阅福利专区" target="_blank" href="{% url 'blog:category' resources '' %}"><i class="rss fa fa-rss"></i></a>
</h1>
</header>
{% for article in page_obj %}
<article class="excerpt">
<header>
<a class="label label-important" href="/category/{{ article.category.bigcategory.name }}/{{ article.category.name|lower }}">{{ article.category.name }}<i class="label-arrow"></i></a>
<h2><a target="_blank" href="/article/{{ article.slug }}" title="{{ article.title }}">{{ article.title }} </a></h2>
</header>
<div class="focus"><a target="_blank" href="/article/{{ article.slug }}">
<img class="thumb" width="200" height="123" src="{{ article.img_link }}" alt="{{ article.title }}" /></a>
</div>
<span class="note"> {{ article.summary }}</span>
<p class="auth-span">
<span class="muted"><i class="fa fa-user"></i> <a href="/author/{{ article.author }}">{{ article.author }}</a></span>
<span class="muted"><i class="fa fa-clock-o"></i> {{ article.create_date|date:'Y-m-d'}}</span>
<span class="muted"><i class="fa fa-eye"></i> {{ article.views }}浏览</span>
<span class="muted"><i class="fa fa-comments-o"></i>
<a target="_blank" href="/article/{{ article.slug }}#comments">评论</a></span>
<span class="muted"><a href="javascript:;" data-action="ding" data-id="455" id="Addlike" class="action">
<i class="fa fa-heart-o"></i><span class="count">{{ article.love }}</span>喜欢</a>
</span>
</p>
</article>
{% empty %}
<div class="no-post">当前分类下还没有发布的文章！</div>
{% endfor %}
{% if is_paginated %}
<div class="pagination">
<ul>
{% if first %}
<li><a href="?page=1">1</a></li>
{% endif %}
{% if left %}
{% if left_has_more %}
<li><span>...</span></li>
{% endif %}
{% for i in left %}
<li class="prev-page"><a href="?page={{ i }}">{{ i }}</a></li>
{% endfor %}
{% endif %}
<li class="active"><a href="?page={{ page_obj.number }}">{{ page_obj.number }}</a></li>
{% if right %}
{% for i in right %}
<li class="next-page"><a href="?page={{ i }}">{{ i }}</a></li>
{% endfor %}
{% if right_has_more %}
<li><span>...</span></li>
{% endif %}
{% endif %}
{% if last %}
<li><a href="?page={{ paginator.num_pages }}">{{ paginator.num_pages }}</a></li>
{% endif %}
</ul>
</div>
{% endif %}
</div>
</div>
{%endblock body%}
自定义模板标签
blog -> templatetags -> blog_tags.py
@register.simple_tag
def get_title(category):
a = BigCategory.objects.filter(slug=category)
if a:
return a[0]
头部引入
{% load blog_tags %}
首页 大分类跳转地址
<a href="{% url 'blog:category' big.slug '' %}">{{ big.name }}</a>
首页大分类下拉菜单小分类地址
<a href="{% url 'blog:category' big.slug c.slug %}">{{ c.name }}</a>
配置路由
# 分类页面
url(r'^category/(?P<bigslug>.*?)/(?P<slug>.*?)', IndexView.as_view(template_name='content.html'), name='category'),
运行查看效果
简单理解路由，这里都是我的个人理解可能不会有官方文档解释的科学，如果读完还有疑惑不要纠结，问题不大，刚开始接触不需要理解的太深入。
{% url 'blog:category' big.slug '' %}
big.slug：是从 bigcategory 表取出的数据，是导航菜单，大分类字段
Django 的路由其实就是使用正则表达式匹配前端 http 请求的路径
http 请求可以理解为，前台的点击事件，比如用户点击 生活笔记 或者 个人随笔
就是告诉服务器我想看这些内容，那么怎么告诉，就是发送 http 请求，这里 {% url 'blog:category' big.slug '' %} 就是 Django 模板定义请求路径的方式
blog：主路由 url('', include('storm.urls', namespace='blog'))， 定义应用空间名 namespace 为 blog，这样后台修改应用 storm 名不会影响前台渲染数据，和配置静态路径一样的道理
category：是storm应用路由 url(r'^category/(?P
比如 这里用户点击生活笔记，那么他的请求路经是
浏览器解析
{% url 'blog:category' big.slug '' %}
后路径即为
http://stormsha.com/category/diary
则 Django 首先去 项目容器 blog -> blog -> urls.py 中匹配这个路径，匹配的规则是首先精准匹配这个路径，就是拿 category 去对比 路由的第一个参数
发现没有 category，如果未匹配到，则进行模糊匹配，就是直接走路由第一个参数为空的路由，那么就进到了
url('', include('storm.urls', namespace='blog')) 这里，include 的第一个参数指向的是子路由位置，
通过这里进入 blog -> storm -> urls.py 继续拿 category 匹配路径，在这里匹配到了
url(r'^category/(?P<bigslug>.*?)/(?P<slug>.*?)', IndexView.as_view(template_name='content.html'), name='category')
好了第一个http请求已经找到归宿
{% url 'blog:category' big.slug '' %}
big.slug：第一个参数 就是 diary，通过 正则匹配到 diary
''：第二个参数为空，因为这里请求的是大分类，但是大分类和小分类这里使用的是同一个路由，所以要置空
如果 用户点击个人随笔，那么请求的路经是 http://stormsha.com/category/diary/life
{% url 'blog:category' big.slug c.slug %}
big.slug：第一个参数，是从数据库中取出的大分类，即为 diary
c.slug：第二个参数是从 category表取出的文章分类字段，即为 life
关于自己
关于自己(about)、给我留言((message)、赞助作者(donate)、技术交流(exchange)、提问交流(question)、项目合作(project)、属于同一类页面，都是静态展示页面 所以要单独创建页面
blog -> templates -> about.html
这里是静态页面，直接拷贝Github 项目中对应页面代码即可
配置路由
url(r'^category/about/$', AboutView, name='about'),
创建视图
def AboutView(request):
return render(request, 'about.html', {'category': 'about'})
运行查看效果
2、总结方法
生活笔记、技术杂谈、福利专区、生活笔记下拉菜单、技术杂谈下拉菜单、标签云、归档、都属于同一类，模仿实现即可
对比项目源码Github，理解视图和 Templatetags 的用法套路
关于自己、给我留言、赞助作者、技术交流、提问交流、项目合作属于同一类模仿实现即可
【友情提示】——如果发现有表达错误，或者知识点错误，或者搞不懂的地方，请及时留言，可以在评论区互相帮助，让后来者少走弯路是我的初衷。我也是一步步摸着石头走过来的，深知网络上只言片语的图文教程，给初学者带来的深深困扰。
【建议】——在对项目结构不太熟悉时，参照完整源码少走弯路
转载请注明： StormSha » Django个人博客开发十一 | 博客首页开发三
