草庐IT

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

suncolor 2023-04-17 原文

展示个人站点页面

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

<div class="col-md-8">
            {% for article in article_list %}
                <ul class="media-list">
                    <li class="media">
                        <a href=""><h4 class="media-heading">{{ article.title }}</h4></a>
                        <div class="media-left">
                            <a href="#">
                                <img class="media-object" src="/media/{{ article.blog.userinfo.avatar }}/" alt="..." width="60">
                            </a>
                        </div>
                        <div class="media-body">
                            {{ article.desc }}
                        </div>
                        <br>
                        <div class="pull-right">
                            <span><a href="">{{ article.blog.userinfo.username }}</a></span>&nbsp;
                            <span>发布于:{{ article.create_time|date:'Y-m-d' }}</span>&nbsp;
                            <span class="glyphicon glyphicon-thumbs-up">点赞数:({{ article.up_num }})</span>&nbsp;
                            <span class="glyphicon glyphicon-comment">评论数:({{ article.comment_num }})</span>&nbsp;
                        </div>
                    </li>
                </ul>
                <br>
            {% endfor %}
        </div>

后端代码:在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文件!!
<link rel="stylesheet" href="/media/css/{{ user_obj.username }}.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)  格式为:<QuerySet [('zhang的分类1', 2), ('zhang的分类2', 1), ('zhang的分类3', 2)]>
    # (2)查询出当前用户的所有标签和标签下的文章数
    tag_list = models.Tag.objects.filter(blog=blog).annotate(count_num=Count('article__pk')).values_list('name','count_num')
    # print(tag_list) 格式为:<QuerySet [('zhang的标签1', 3), ('zhang的标签2', 2), ('zhang的标签3', 2)]>

前端:

            <div class="panel panel-primary">
                <div class="panel-heading">
                    <h3 class="panel-title">文章分类</h3>
                </div>
                <div class="panel-body">
                    {% for category in category_list %}
                        <p><a href="">{{ category.0 }}({{ category.1 }})</a></p>
                    {% endfor %}
                </div>
            </div>

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

我们在创建文章的时候,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字段分组,统计出当前文章的个数,最后取值!

前端:
            <div class="panel panel-info">
                <div class="panel-heading">
                    <h3 class="panel-title">日期归档</h3>
                </div>
                <div class="panel-body">
                    {% for data in data_list %}
                        <p><a href="">{{ data.month|date:'Y年m月' }}({{ data.count_num }})</a></p>
                    {% endfor %}
                </div>
            </div>

有关个人站点页面搭建和侧边栏展示功能的更多相关文章

  1. ruby-on-rails - Cucumber 是否只是 rspec 的包装器以帮助将测试组织成功能? - 2

    只是想确保我理解了事情。据我目前收集到的信息,Cucumber只是一个“包装器”,或者是一种通过将事物分类为功能和步骤来组织测试的好方法,其中实际的单元测试处于步骤阶段。它允许您根据事物的工作方式组织您的测试。对吗? 最佳答案 有点。它是一种组织测试的方式,但不仅如此。它的行为就像最初的Rails集成测试一样,但更易于使用。这里最大的好处是您的session在整个Scenario中保持透明。关于Cucumber的另一件事是您(应该)从使用您的代码的浏览器或客户端的角度进行测试。如果您愿意,您可以使用步骤来构建对象和设置状态,但通常您

  2. ruby - 在 ASP 页面上 Mechanize 中断 - 2

    require'mechanize'agent=Mechanize.newlogin=agent.get('http://www.schoolnet.ch/DE/HomeDE.htm')agent.clicklogin.link_withtext:/Login/然后我得到Mechanize::UnsupportedSchemeError。 最佳答案 Mechanize不支持javascript但您可以将搜索字段添加到表单并为其分配搜索词并使用mechanize提交表单form=page.forms.firstform.add_fie

  3. ruby-on-rails - prawnto 显示新页面时不会中断的表格 - 2

    我有可变数量的表格和可变数量的行,我想让它们一个接一个地显示,但如果表格不适合当前页面,请将其放在下一页,然后继续。我已将表格放入事务中,以便我可以回滚然后打印它(如果高度适合当前页面),但我如何获得表格高度?我现在有这段代码pdf.transactiondopdf.table@data,:font_size=>12,:border_style=>:grid,:horizontal_padding=>10,:vertical_padding=>3,:border_width=>2,:position=>:left,:row_colors=>["FFFFFF","DDDDDD"]pdf.

  4. ruby-on-rails - rails 功能测试 - 2

    在Rails自动生成的功能测试(test/functional/products_controller_test.rb)中,我看到以下代码:classProductsControllerTest我的问题是:方法调用products()在哪里/如何定义?products(:one)到底是什么意思?看代码,大概意思是“创建一个产品”,但是它是如何工作的呢?注意我是Ruby/Rails的新手,如果这些是微不足道的问题,我深表歉意。 最佳答案 如果您查看test/fixtures文件夹,您会看到一个products.yml文件。这是在您创建

  5. ruby - 每个页面上的 Jekyll 分页 - 2

    据我们所知,Jekyll默认分页仅支持index.html,我想创建blog.html并在那里包含分页。有什么解决办法吗? 最佳答案 如果您创建一个名为/blog的目录并在其中放置一个index.html文件,那么您可以向_config.yml表示paginate_path:"blog/page:num"。不是使用根文件夹中的默认index.html作为分页器模板,而是使用/blog/index.html。分页器将根据需要生成类似/blog/page2/和/blog/page3/的页面。这将使您到达yourwebsite.com/b

  6. ruby-on-rails - 功能测试 Authlogic? - 2

    在我的一些Controller中,我有一个before_filter检查用户是否登录?用于CRUD操作。application.rbdeflogged_in?unlesscurrent_userredirect_toroot_pathendendprivatedefcurrent_user_sessionreturn@current_user_sessionifdefined?(@current_user_session)@current_user_session=UserSession.findenddefcurrent_userreturn@current_userifdefine

  7. ruby-on-rails - RoR && "coming soon"页面 - 2

    我正在寻找一种简单的方法来为我在RubyonRails上的项目实现简单的“即将推出”(预启动)页面。用户应该能够留下电子邮件以便在项目启动时收到通知。有没有这样的插件\gem?或者我应该自己做... 最佳答案 LaunchingSoon是一个Rails插件。它还集成了MailChimp或Campaignmonitor. 关于ruby-on-rails-RoR&&"comingsoon"页面,我们在StackOverflow上找到一个类似的问题: https:/

  8. ruby - 如何让 GitHub 页面使用 master 分支? - 2

    我有一个使用Jekyll托管在GitHub上的静态网站。问题是,我真的不需要master分支,因为存储库唯一包含的是网站。这样我就必须gitcheckoutgh-pages,然后gitmergemaster,然后gitpushorigingh-pages。有什么简单的方法可以摆脱gh-pages分支并直接从master推送? 最佳答案 Theproblemis,Idon'treallyneedthemasterbranch,astheonlythingtherepositorycontainsisthewebsite.Isthere

  9. ruby - 如何设置 Mechanize 页面编码? - 2

    我试图通过点击一个链接获得一个带有ISO-8859-1编码的页面,所以代码类似于这样:page_result=page.link_with(:text=>'link_text').click到目前为止,我得到的结果编码错误,所以我看到的字符如下:'T�tulo:'insteadof'Título:'我尝试了几种方法,包括:使用代理在第一个请求中声明编码:@page_search=@agent.get(:url=>'http://www.server.com',:headers=>{'Accept-Charset'=>'ISO-8859-1'})说明页面本身的编码page_result.

  10. Linux磁盘分区中物理卷(PV)、卷组(VG)、逻辑卷(LV)创建和(LVM)管理 - 2

    文章目录一基础定义二创建逻辑卷2-1准备物理设备2-2创建物理卷2-3创建卷组2-4创建逻辑卷2-5创建文件系统并挂载文件三扩展卷组和缩减卷组3-1准备物理设备3-2创建物理卷3-3扩展卷组3-4查看卷组的详细信息以验证3-5缩减卷组四扩展逻辑卷4-1检查卷组是否有可用的空间4-2扩展逻辑卷4-3扩展文件系统五删除逻辑卷5-1备份数据5-2卸载文件系统5-3删除逻辑卷5-4删除卷组5-5删除物理卷六LVM逻辑卷缩容6-1缩容注意事项6-2标准缩容步骤一基础定义LVM,LogicalVolumeManger,逻辑卷管理,Linux磁盘分区管理的一种机制,建立在硬盘和分区上的一个逻辑层,提高磁盘分

随机推荐