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

展示个人站点页面

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

创新互联公司服务电话:18982081108,为您提供成都网站建设网页设计及定制高端网站建设服务,创新互联公司网页制作领域十年,包括成都餐厅设计等多个方面拥有多年的网站推广经验,选择创新互联公司,为网站锦上添花!

{% for article in article_list %}
{% endfor %}

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

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

侧边栏展示功能

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

对于不同个人站点需要不同样式时,我们可以在media文件夹下新建一个css文件夹,里面可以存放用户上传的不同css文件,再在个人站点html页面下面添加对应站点的css文件!!

侧边栏展示了三大版块,分别是:文章分类、文章标签、日期归档!

文章分类和文章标签的书写和渲染,只要将其在后端对应查询出来,如何传入前端页面,交给模板页面渲染即可!
后端:

    # 5.侧边栏数据传入
    # (1)查询出当前用户所有的分类及分类下的文章数
    category_list = models.Category.objects.filter(blog=blog).annotate(count_num=Count('article__pk')).values_list('name','count_num')
    # print(category_list)  格式为:
    # (2)查询出当前用户的所有标签和标签下的文章数
    tag_list = models.Tag.objects.filter(blog=blog).annotate(count_num=Count('article__pk')).values_list('name','count_num')
    # print(tag_list) 格式为:

前端:

            

文章分类

{% for category in category_list %}

{{ category.0 }}({{ category.1 }})

{% endfor %}

关于日期归档版块的渲染:

我们在创建文章的时候,create_time字段是包含年月日时分秒的,而我们进行日期归档的时候往往是按照年月进行归档的!

所有,这时候就需要用到django官方提供的一个TruncMonth模块

它的功能是能够帮您在生成一个临时的查询表,新增了一个年月的字段,如何按这个字段进行分组查询

from django.db.models.functions import TruncMonth

后端:
    # (3)按照年月统计出当前用户所有的文章
    data_list = models.Article.objects.filter(blog=blog).annotate(month=TruncMonth('create_time')).values('month').annotate(count_num=Count('pk')).values('month','count_num')
    # print(data_list)
# 这句查询语句的意思是先查出当前用户,然后利用TruncMonth对create_time进行过滤新增一个month年月字段,然后.values按照month字段分组,统计出当前文章的个数,最后取值!

前端:
            

日期归档

{% for data in data_list %}

{{ data.month|date:'Y年m月' }}({{ data.count_num }})

{% endfor %}

分享题目:个人站点页面搭建和侧边栏展示功能
网站路径:http://ybzwz.com/article/dsogcjd.html