Django博客开发教程:实现文章内容页

合集 - Django博客开发教程(21)

1.1、Django博客开发教程:开发前的准备2023-08-072.2、Django博客开发教程:项目需求分析2023-08-073.Django博客开发教程:数据库设计分析2023-08-074.Django博客开发教程:创建项目2023-08-075.Django博客开发教程:基础配置2023-08-086.Django博客开发教程:欢迎页面2023-08-087.Django博客开发教程:创建数据库模型2023-08-088.Django博客开发教程:用Admin管理后台管理数据2023-08-089.Django博客开发教程:使用富文本编辑器添加数据2023-08-0910.Django博客开发教程:使用ckeditor富文本编辑器添加数据2023-08-1411.Django博客开发教程:URL与视图函数2023-08-0812.Django博客开发教程:体验django模板,2023-08-0813.Django博客开发教程:体验数据查询2023-08-0814.Django博客开发教程:一些常用的模板使用方法2023-08-0815.Django博客开发教程:实现模板之前的分析与准备2023-08-0916.Django博客开发教程:实现网站首页2023-08-0917.Django博客开发教程:实现文章列表2023-08-16

18.Django博客开发教程:实现文章内容页2023-08-16

19.Django博客开发教程:实现标签页面2023-08-1620.Django博客开发教程:实现搜索页面2023-08-1621.Django博客开发教程:单页面实现与代码优化2023-08-16

收起

文章内容的URL是：网站域名/show-文章ID.html，文章ID是通过URL里的sid传进来的。

视图函数代码：

1 2 3 4 5 6 7 8 9 10 11 12 13

blog/views.py   def show(request,sid):     show = Article.objects.get(id=sid)#查询指定ID的文章     allcategory = Category.objects.all()#导航上的分类     tags = Tag.objects.all()#右侧所有标签     remen = Article.objects.filter(tui__id=2)[:6]#右侧热门推荐     hot = Article.objects.all().order_by('?')[:10]#内容下面的您可能感兴趣的文章，随机推荐     previous_blog = Article.objects.filter(created_time__gt=show.created_time,category=show.category.id).first()     netx_blog = Article.objects.filter(created_time__lt=show.created_time,category=show.category.id).last()     show.views = show.views + 1     show.save()     return render(request, 'show.html', locals())

代码里Article.objects.get(id=sid)，因为获取的是单个对象，所以用get方法，id=sid查询URL传过来的指定id的文章。previous_blog和netx_blog是文章上一篇下一篇，我们通过发布文章时间来进行筛选文章的，比当前文章发布的时间小就是上一篇，比当前文章发布时间大就是下一篇。category=show.category.id，则是指定查询的文章为当前分类下的文章。

文章的浏览数，我们先通过show.views查询到当前浏览数，然后对这个数进行加1操作，意思是每访问一次页面（视图函数），就进行加1操作。然后再通过show.save()进行保存。

1 2	show.views = show.views + 1 show.save()

打开文章内容页模板show.html页面。最上边，您的位置，那里的代码修改为：

1 2 3

<div class="breadcrumb">您的位置： <a itemprop="breadcrumb" href="{% url 'index' %}">首页</a> » <a     href="{% url 'index' %}list-{{ show.category.id }}.html">{{ show.category.name }}</a> » <span class="current">正文</span></div>

文章标题修改为：

1	<h1 class="post-title">{{ show.title }}</h1>

标题下的几个字段修改为：

1 2 3 4

<span class="item">分类：<a href="{% url 'index' %}list-{{ show.category.id }}.html" rel="category tag">{{ show.category.name }}</a></span> <span class="item">作者：{{ show.user }}</span> <span class="item">浏览：{{ show.views }}</span> <span class="item">{{ show.created_time }}</span>

文章内容里内容信息修改为：

1 2 3

<article class="article-content"> {{ show.body|safe }} </article>

文章内容信息下面的文章标签，修改为：

1 2 3 4 5

<div class="post-tag"><span class="fa fa-tags" aria-hidden="true"></span>标签： {% for tag in show.tags.all %}     <a href="{% url 'index' %}tag/{{ tag.name }}" rel="tag">{{ tag.name }}</a> {% endfor %} </div>

值得留意的是标签的URL构造，要结合myblog/urls.py里的结构来构造。

文章的上一篇下一篇修改为：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17

<div>         <div><b>上一篇：</b>             {% if netx_blog %}                 <a href="show-{{ netx_blog.pk }}.html" class="article-tag">{{ netx_blog }}</a>             {% else %}                 没有了             {% endif %}         </div>         <div><b>下一篇：</b>             {% if previous_blog %}                 <a href="show-{{ previous_blog.pk }}.html" class="article-tag">{{ previous_blog }}</a>             {% else %}                 没有了             {% endif %}         </div>     </div> </div>

这里面要留意的就是需要判断当前文章有没有上一篇和下就篇。有的话就显示，没有的话就输出'没有了'。

文章内容最下面的'你可能感兴趣：'这里我直接是随机调用的文章，大家如果想调用与文章相关联的文章，可以通过查询相同标签下文章进行展现，这样关联性就会强一些，当前了如果你的文章想进行一些商业广告推送，你也可以通过在后台添加推荐位来实现。了解原理之后，可以灵活根据自己的需求来实现。

1 2 3 4 5 6 7 8 9 10 11 12 13 14

<ul> {% for h in hot %} <li>  <div class="pic">    <a href="{% url 'index' %}show-{{ h.id }}.html" title="{{ h.title }}">    <img src="{% url 'index' %}media/{{ h.img }}"      srcset="{% url 'index' %}media/{{ h.img }}"      alt="{{ h.title }}" class="wp-post-image" width="145" height="100"/></a>   </div>     <a class="descript " href="{% url 'index' %}show-{{ h.id }}.html" rel="bookmark"            title="{{ h.title }}">{{ h.title }}</a> </li> {% endfor %} </ul>

至此，文章内容页实现完毕。