基于django的个人博客网站建立(四)

news/2024/5/12 5:05:29/文章来源:https://blog.csdn.net/weixin_33766168/article/details/93707797

基于django的个人博客网站建立(四)

前言

网站效果可点击这里访问


今天主要添加了留言与评论在后台的管理和主页文章的分页显示,文章类别的具体展示以及之前预留链接的补充

主要内容

其实今天的内容和前几天的基本相似,就是个体力活

首先是评论在后台的管理:


@auth
def view_comment(request):if request.method == 'GET':all_comment = models.Comment.objects.all().order_by('id').reverse()return render(request, 'backend/view_comment.html', {'all_comment': all_comment})

{% extends 'backend/base.html' %}{% block link %}<!-- Bootstrap Markdown -->{% endblock %}{% block content %}<div class="content-wrapper"><!-- Content Header (Page header) --><section class="content-header"><h1>查看评论</h1><ol class="breadcrumb"><li class="breadcrumb-item"><a href="#">我的博客后台</a></li><li class="breadcrumb-item active">查看评论</li></ol></section><!-- Main content --><section class="content"><div class="row"><div  class="col-lg-12"><div class="box"><div class="box-header with-border"><h3 class="box-title">评论列表</h3></div><!-- /.box-header --><div style="height: auto"  class="box-body"><div class="table-responsive"><table id="articlelist" class="table table-hover no-wrap dataTable" data-page-size="10" role="grid" aria-describedby="articlelist_info"><thead><tr role="row"><th class="sorting_asc" tabindex="0" aria-controls="articlelist" rowspan="1" colspan="1" aria-sort="ascending" aria-label="No: activate to sort column descending">Id</th><th class="sorting" tabindex="0" aria-controls="articlelist" rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending">Username</th><th class="sorting" tabindex="0" aria-controls="employeelist" rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending">content</th><th class="sorting" tabindex="0" aria-controls="employeelist" rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending">creationTime</th><th class="sorting" tabindex="0" aria-controls="employeelist" rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending">Email</th><th class="sorting" tabindex="0" aria-controls="employeelist" rowspan="1" colspan="1" aria-label="Name: activate to sort column ascending">Articletitle</th><th class="sorting" tabindex="0" aria-controls="articlelist" rowspan="1" colspan="1" aria-label="Action: activate to sort column ascending">Action</th></tr></thead><tbody>{% for comment in all_comment %}<tr role="row" class="odd"><td class="sorting_1">{{ comment.id }}</td><td>{{ comment.userName }}</td><td>{{ comment.content }}</td><td>{{ comment.creationTime }}</td><td>{{ comment.email }}</td><td>{{ comment.article.title }}</td><td><form style="margin-top: 3px" action="/backend/delete_comment/" method="post">{% csrf_token %}<input name="delete_comment_id" style="display: none" type="text" value="{{ comment.id }}"><button type="submit" class="btn btn-sm btn-danger-outline" data-toggle="tooltip" data-original-title="删除"><i class="ti-trash" aria-hidden="true"></i></button></form></td></tr>{% endfor %}</tbody></table></div></div></div><!-- /.box --></div></div></section><!-- /.content --></div>{% endblock %}{% block script %}<script>$('#view_comment').addClass('active')</script>{% endblock %}

删除评论:


@auth
def delete_comment(request):if request.method == 'POST':delete_comment_id = request.POST.get('delete_comment_id')models.Comment.objects.filter(id=delete_comment_id).delete()return redirect('/backend/view_comment')

然后同样是留言的管理:


@auth
def view_message(request):if request.method == 'GET':all_message = models.Message.objects.all().order_by('id').reverse()return render(request, 'backend/view_message.html', {'all_message': all_message})@auth
def delete_message(request):if request.method == 'POST':delete_message_id = request.POST.get('delete_message_id')models.Message.objects.filter(id=delete_message_id).delete()return redirect('/backend/view_message')

接下来讲主页的分页显示

这里主要用了django的Paginator做了分页管理:


def index(request):if request.method == 'GET':all_article = models.Article.objects.all().order_by('id').reverse()paginator = Paginator(all_article,7)page = request.GET.get('page')try:contacts = paginator.page(page)except PageNotAnInteger:contacts = paginator.page(1)except EmptyPage:contacts = paginator.page(paginator.num_pages)all_type = models.ArticleType.objects.all()return render(request, 'show/index.html',{'all_article':contacts,'all_type':all_type})

页面显示也做了修改


{% extends "show/base.html" %}<!-- ======================== END HEADER AREA HERE ================================= --><!-- =================== START MAIN CONTENT AREA HERE ========================-->
{% block main %}<main class="main-content-area section-padding-bottom"><div class="container"><div class="row"><div class="col-md-12"><div class="row">{% for article in all_article %}<div class="col-md-10 mx-auto nagative-margin" data-aos="fade"><div class="themeix-single-post"><div class="left-post-number float-left"><div class="post-number"><span>{{ article.id }}</span></div></div><div class="right-blog-details "><div class="blog-meta"><p>{{ article.creationTime }}</p>{% for type in article.articletotype_set.all %}<p>{{ type.type.name }}</p>{% endfor %}</div><div class="blog-title pb-3 pt-1"><h2 class="heading-2"><a href="/blog-details/?article_id={{ article.id }}">{{ article.title }}</a></h2></div><div class="blog-thumb mb-0"><a href="/blog-details/?article_id={{ article.id }}"><img src="/static/assets/images/article/{{ article.id }}.jpg" alt="post" /></a></div></div></div></div>{% endfor %}</div></div></div><div class="post-pagination text-center" data-aos="fade-up"><ul>{% if all_article.has_previous %}<li><a href="/index?page={{ all_article.previous_page_number }}"><i class="fa fa-angle-double-left" aria-hidden="true"></i></a></li>{% endif %}{% if all_article.has_previous %}<li><a href="/index?page={{ all_article.previous_page_number }}">{{ all_article.previous_page_number }}</a></li>{% endif %}<li id="nowpage" style="font-weight: 600;background: #1D2EF2;transition: 0.4s;color: white!important;border: 1px solid #1D2EF2;" ><a style="color: white!important;" href="/index?page={{ all_article.number }}">{{ all_article.number }}</a></li>{% if all_article.has_next %}<li><a href="/index?page={{ all_article.next_page_number }}">{{ all_article.next_page_number }}</a></li>{% endif %}{% if all_article.has_next %}<li><a href="/index?page={{ all_article.next_page_number }}"><i class="fa fa-angle-double-right" aria-hidden="true"></i></a></li>{% endif %}</ul></div></div></main><!-- ======================== END MAIN CONTENT AREA HERE ========================--><!-- ==================== START FOOTER AREA ===================================== -->
{% endblock %}

显示为:

接下来为文章的所有分类做了一个页面来显示


def category(request):if request.method == 'GET':all_type = models.ArticleType.objects.all()return render(request, 'show/category.html', {'all_type': all_type})

{% extends "show/base.html" %}<!-- ======================== END HEADER AREA HERE ================================= --><!-- =================== START MAIN CONTENT AREA HERE ========================-->{% block header-text %}<div class="header-text text-center"><span>{% now "Y-m-d" %}</span><h1 class="heading-1 mb-5 mt-1">Categories</h1><div class="themeix-author"><a href="author.html"><img style="width: 100px;height: 100px" src="/static/assets/images/myavator.png" alt="author" /></a><h4 class="heading-4 pt-2 pb-3"><a href="/index">huchengyue</a></h4></div></div>
{% endblock %}{% block main %}<!-- ======================== END HEADER AREA HERE ================================= --><!-- =================== START MAIN CONTENT AREA HERE ========================--><main class="main-content-area section-padding-bottom clearfix wow fadeIn" data-wow-duration="2s"><div class="page-wrapper tags-page"><div class="container"><div class="row"><div class="col-md-12"><div class="row"><div class="col-md-10 mx-auto nagative-margin pb-0">{% for type in all_type %}<div class="row dotted-border mb-60" data-aos="fade-up"><div class="col-md-6"><div class="tags-thumb"><a href="/category/details/?type={{ type.name }}"><img src="https://source.unsplash.com/random/800x450?{{ type.id }}" alt="tag-thumb" /></a></div></div><div class="col-md-6"><div class="tags-right-text"><div class="btn-post"><span>{{ type.articletotype_set.all.count }} post</span></div><div class="tag-title"><h2 class="heading-2"><a href="/category/details/?type={{ type.name }}">{{ type.name }}</a></h2></div><p>该分类为{{ type.name }},具体文章请点击查看</p><div class="btn-more"><a href="/category/details/?type={{ type.name }}">View All</a></div></div></div></div>{% endfor %}</div></div></div></div></div></div></main><!-- ======================== END MAIN CONTENT AREA HERE ========================--><!-- ==================== START FOOTER AREA ===================================== -->
{% endblock %}

图中每一个分类的配图是使用的https://source.unsplash.com/random/800x450 网站的随机图片,所以页面加载的有一点慢,但还可以接受

最后就是点击分类进入该分类的文章区域,和主页显示的类似,不多说了。

总结

对于文章的相关的东西到目前为止基本差不多了,大体功能已经实现,一些细节部分以后再完善,明天预计完成一个添加照片分享的功能,可以记录和展示一下自己拍到的或收集到的图片。

转载于:https://www.cnblogs.com/sfencs-hcy/p/10940409.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.luyixian.cn/news_show_788955.aspx

如若内容造成侵权/违法违规/事实不符,请联系dt猫网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ffmpeg技术 - 一个不错的网站_拔剑-浆糊的传说_新浪博客

http://www.ffmpeg.com.cn 首页 [编辑]ffmpeg技术 http://www.ffmpeg.com.cn ffmpeg快速入门 ffmpeg简介 ffmpeg入门基础知识 ffmpeg快速安装 ffmpeg快速命令使用 ffmpeg快速应用开发 ffmpeg编译详解 ffmpeg编译FAQ集 ffmpeg命令使用 ffmpeg使用事例 ffplay使用事例 ffserver使…

web应用程序和web网站_使用推荐引擎个性化您的Web应用程序

web应用程序和web网站为了在快速发展的全球行业中保持相关性&#xff0c;技术专业人员必须跟踪IT的重大趋势&#xff0c;并找到方法将重要的趋势纳入其公司的技术产品组合中。 这样的趋势之一就是使用推荐引擎来驱动用户探索您的网站或企业的其他产品。 这些引擎根据各种模式向…

互动3D网站已触手可及

XML3D仅仅需要适当的3D模型、互联网连接和一个浏览器&#xff0c;就可以让顾客看到网上商店里的互动3D物品。当顾客访问一家在线商店时&#xff0c;他们往往希望能看到商品的整个全貌。比如&#xff0c;想放大了看&#xff0c;或者通过调整角度让物品形象化。直到现在&#xff…

web应用程序和web网站_改善Web应用程序的性能

web应用程序和web网站总览 富Internet应用程序&#xff08;RIA&#xff09;在Web 2.0域中非常流行。 为了提供新颖新颖的用户体验&#xff0c;许多网站都使用JavaScript或Flash将其复杂的内容从后端服务器移至客户端。 如果数据大小相当小&#xff0c;这将提供方便&#xff0c…

自学html5的网站有什么区别,在微信上HTML5 网页和普通的网页开发有何不同

原标题&#xff1a;在微信上HTML5 网页和普通的网页开发有何不同html5网页开发自问世以来受到的关注应该超过了开发者们的预期&#xff0c;在微信开发上html5网页技术的特性同样被高度运用。本文华清创客学院讲师和大家分享一下在微信上HTML5 网页和普通的网页开发有何不同?在…

爬取网站视频命令行工具you-get的安装及使用方法

爬取网站视频命令行工具you-get安装及使用方法软件简介下载方法Step.01Step.02使用方法报错提示软件简介 you-get 是一个跨平台命令行视频、音频与图像下载工具&#xff0c;支持国内外常用的各种多媒体网站。 下载方法 Step.01 下载Python&#xff0c;可以在python官网下载…

html5和css3_使用HTML5和CSS3创建现代网站

html5和css3在你开始前 本教程假定您具有HTML&#xff0c;CSS和JavaScript的一些基本经验。 它假定您了解HTML元素或标记是什么&#xff0c;属性的含义&#xff0c;HTML标记的基本语法&#xff0c;网页的一般结构&#xff0c;等等。 就CSS而言&#xff0c;您应该熟悉基于元素&…

【已解决】Nginx部署网站后外网访问不了

解决方案&#xff1a; 加入nginx.exe的路径

Github/Gitlab/Gitee徽章生成网站shields.io的使用方法

网站地址&#xff1a;https://shields.io/ 【静态徽标】 label&#xff1a;左边标签 message&#xff1a;右边具体信息 color&#xff1a;颜色&#xff0c;常用颜色如下 网址1&#xff1a;https://img.shields.io/static/v1?label<LABEL>&message<MESSAGE>…

IBM Security Access Manager:通过基于上下文的访问保护网站

IBM Security Access Manager for Mobile&#xff08;ISAM for Mobile&#xff09;允许安全设计师通过IBM Security Access Manager for Web&#xff08;ISAM for Web&#xff09;对Web访问执行基于上下文的授权&#xff08;CBA&#xff09;决策&#xff08;也称为基于风险的访…

php模板框架教程,PHP制作静态网站的模板框架教程

模板能够改善网站的结构。本文阐述如何通过PHP 4的一个新功能和模板类&#xff0c;在由大量静态HTML页面构成的网站中巧妙地运用模板控制页面布局。提纲&#xff1a;分离功能和布局避免页面元素重复静态网站的模板框架分离功能和布局首先我们来看看应用模板的两个主要目的&…

官网用什么php系统搭建开源,用云服务器搭建Typecho网站(开源PHP建站系统),...

用云服务器搭建Typecho网站(开源PHP建站系统)&#xff0c;用云服务器搭建Typecho&#xff0c;Typecho来自于开发团队的头脑风暴&#xff0c;基于PHP5开发&#xff0c;支持多种数据库&#xff0c;是一款内核强健﹑扩展方便﹑体验友好﹑运行流畅的轻量级开源博客程序。第一步、搭…

html表单收集信息,如何在网站上嵌入表单来获取访客信息

原标题&#xff1a;如何在网站上嵌入表单来获取访客信息有时我们在浏览某个网站的时候&#xff0c;会看到网站上有在线提交信息的表格&#xff0c;比如“问题反馈表”、“申请参会表”等&#xff0c;这就是网站表单。对于企业来说&#xff0c;在自己的官网上做这样一个在线表单…

很实用的网站收集

很实用的网站收集 ● gif 动画在线生成 loading GIF图片生成 loading GIF图片 在线loading图片制作工具 intoGIF ● CSS 标签兼容性 Can I use... Support tables for HTML5, CSS3, etc ● 网页兼容性测试 LambdaTest ● SVN 托管 免费有大小限制&#xff0c;可以购买空间 …

百度百科网站源码,国外多语言wikipedia百科网站搭建 第一篇

前端时间我这边研究一下类似百度百科的网站&#xff0c;然后按照百度百科的一些功能&#xff0c;还有结合了海外做得比较大的wikipedia百科功能&#xff0c;做了整合开发&#xff0c;现在把那个项目的开发过程等功能&#xff0c;提供给大家参考&#xff0c;希望能够帮到大家的学…

165个站长在线工具箱网站源码/野兔在线工具系统V2.2.7中文版

有165个以上的在线工具功能&#xff0c;也是目前在线工具功能最完善的一个&#xff0c;最新的野兔在线工具系统V2.2.7中文版 系统名称&#xff1a;野兔在线工具系统 系统语言&#xff1a;中文版 系统开发&#xff1a;PHPMySQL 野兔在线工具系统V2.2.7中文版 2022.02.14更新…

css img 适配尺寸_纯CSS一分钟让网站拥有暗黑模式切换功能

前言暗黑模式这个概念最早起源于MacOS系统的Mojave&#xff0c;提供浅色主题和深色主题两种皮肤供用户选择&#xff0c;深色主题就是我们常说的暗黑模式。为了眼睛健康&#xff0c;笔者在手机、平板和电脑上都选择了暗黑模式。主题皮肤随着苹果官方逐渐要求各大系统平台都得适配…

r星你的计算机网络正在自动发送查询,当你在《GTA4》中的网吧,输入了知名网站会怎样?网费真贵!...

原标题&#xff1a;当你在《GTA4》中的网吧&#xff0c;输入了知名网站会怎样&#xff1f;网费真贵&#xff01;GTA4当时在2008年发布的时候你激动吗&#xff1f;但是我年龄还小&#xff0c;并不知道这款游戏&#xff0c;但是没过多久我就开始玩这款游戏了&#xff0c;应该是在…

网站从Http升级为Https真实案例,SSL免费证书加密

从安全角度考虑,公司需要将一个网站从http普通模式升级为https模式,阿里云提供了免费的SSL证书,故这里根据阿里云的SSL证书来做升级. 1.免费证书申请,配置域名 1)SSL 0元购买 2)填写信息,SSL证书与域名绑定 填写域名及个人信息,完成证书申请,会得到key码.需要登录域名购买平台…

mysql网络流量监控_网站监控工具大全,linux下的几个网络流量监控工具

1、nethogs1)NetHogs是一款开源、免费的&#xff0c;终端下的网络流量监控工具&#xff0c;它可监控Linux的进程或应用程序的网络流量。NetHogs只能实时监控进程的网络带宽占用情况。NetHogs支持IPv4和IPv6协议&#xff0c;支持本地网卡以及PPP链接2、IIS7网站监控IIS7网站监控…