个人站点页面搭建和侧边栏展示功能

展示个人站点页面

前端代码：和首页文章展示基本一样：

1.             {% for article in article_list %}
2.                 <ul >
3.                     <li >
4.                         <a target="_blank" href="https://www.cnblogs.com/"><h4 >{{ article.title }}</h4></a>
5.                         
6.                             <a target="_blank" href="https://www.cnblogs.com/#">
7.                                 <img  src="https://www.cnblogs.com/media/{{ article.blog.userinfo.avatar }}/" alt="..." width="60">
8.                             </a>
9.                         
10.                         
11.                             {{ article.desc }}
12.                         
13.                         <br>
14.                         
15.                             <a target="_blank" href="https://www.cnblogs.com/">{{ article.blog.userinfo.username }}</a> 
16.                             发布于：{{ article.create_time|date:'Y-m-d' }} 
17.                             点赞数：({{ article.up_num }}) 
18.                             评论数：({{ article.comment_num }}) 
19.                         
20.                     </li>
21.                 </ul>
22.                 <br>
23.             {% endfor %}
24.         

复制代码

后端代码：在url中需要手动输入不同的用户名，所以需要视图函数需要输入参数username

1. def site(request,username):
2.     # 1.先查出手动输入的username对应的用户对象
3.     user_obj = models.UserInfo.objects.filter(username=username).first()
4.     # 2.如果输入的用户名不存在，则报错跳转404页面
5.     if not user_obj:
6.         return render(request,'error.html')
7.     # 3.查询出个人用户对应的个人站点
8.     blog = user_obj.blog
9.     # 4.根据个人站点查出对应的文章
10.     article_list = models.Article.objects.filter(blog=blog)
11.     return render(request,'site.html',locals())

复制代码

侧边栏展示功能

补充小知识点：个人站点样式搭建

1. 对于不同个人站点需要不同样式时，我们可以在media文件夹下新建一个css文件夹，里面可以存放用户上传的不同css文件，再在个人站点html页面下面添加对应站点的css文件!!
2. <link rel="stylesheet" href="/media/css/{{ user_obj.username }}.css">

复制代码

侧边栏展示了三大版块，分别是：文章分类、文章标签、日期归档！
文章分类和文章标签的书写和渲染，只要将其在后端对应查询出来，如何传入前端页面，交给模板页面渲染即可！
后端：

1.     # 5.侧边栏数据传入
2.     # （1）查询出当前用户所有的分类及分类下的文章数
3.     category_list = models.Category.objects.filter(blog=blog).annotate(count_num=Count('article__pk')).values_list('name','count_num')
4.     # print(category_list)  格式为：<QuerySet [('zhang的分类1', 2), ('zhang的分类2', 1), ('zhang的分类3', 2)]>
5.     # （2）查询出当前用户的所有标签和标签下的文章数
6.     tag_list = models.Tag.objects.filter(blog=blog).annotate(count_num=Count('article__pk')).values_list('name','count_num')
7.     # print(tag_list) 格式为：<QuerySet [('zhang的标签1', 3), ('zhang的标签2', 2), ('zhang的标签3', 2)]>

复制代码

前端：

1.             
2.                
3.                     <h3 >文章分类</h3>
4.                
5.                
6.                     {% for category in category_list %}
7.                         <p><a target="_blank" href="https://www.cnblogs.com/">{{ category.0 }}({{ category.1 }})</a></p>
8.                     {% endfor %}
9.                
10.             

复制代码

关于日期归档版块的渲染：
我们在创建文章的时候，create_time字段是包含年月日时分秒的，而我们进行日期归档的时候往往是按照年月进行归档的！
所有，这时候就需要用到django官方提供的一个TruncMonth模块
它的功能是能够帮您在生成一个临时的查询表，新增了一个年月的字段，如何按这个字段进行分组查询

1. from django.db.models.functions import TruncMonth
3. 后端：
4.     # （3）按照年月统计出当前用户所有的文章
5.     data_list = models.Article.objects.filter(blog=blog).annotate(month=TruncMonth('create_time')).values('month').annotate(count_num=Count('pk')).values('month','count_num')
6.     # print(data_list)
7. # 这句查询语句的意思是先查出当前用户，然后利用TruncMonth对create_time进行过滤新增一个month年月字段，然后.values按照month字段分组，统计出当前文章的个数，最后取值！
9. 前端：
10.             
11.                
12.                     <h3 >日期归档</h3>
13.                
14.                
15.                     {% for data in data_list %}
16.                         <p><a target="_blank" href="https://www.cnblogs.com/">{{ data.month|date:'Y年m月' }}({{ data.count_num }})</a></p>
17.                     {% endfor %}
18.                
19.             

复制代码

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！