新手用python Django 创建个人博客的第三天

博客模块列表页listmodels.pyurls.pyviews.py前端blog_list.html 详情页detail

今天是用Django创建个人博客的第三天，今天打算做博客模块了，又想了一下登录模块那里的一些需要补足的地方，少了验证提示，这个在这里做一下记录，等主题工作完成再一一补上。

博客模块

博客模块又或者说任何模块都跑不掉增删改查这几个操作，只能少不能多。

前面说我的个人博客模块主要做两个页面，一个列表页list和一个详情页detail，那先来写列表页list。

列表页list

列表的话就模仿一下csdn的列表来一份好了。

{% extends 'index.html' %} {% block content %} <div class="b_list"> <ul class="list-group"> <li class="list-group-item"> <span class="badge">14</span> Cras justo odio </li> </ul> </div> <style> .b_list{ width: 60%; float: left; margin-left: 30px; } </style> {% endblock %}

先做到这里就可以放着了，因为里面有些牵扯到后端的元素，要把后端做出来才能往下做。

回到blog_list应用下。

在写这个的时候卡壳很多次，因为数据库和admin后台管理页面的原因，做了很多次的删删改改，中途还出现很多不是毛病的毛病。最终写成这样，算是初步完成。以下是代码：

models.py

from django.db import models from blog_login.models import * # Create your models here. class BlogView(models.Model): btitle = models.CharField(max_length=100) # 博客标题 btext = models.TextField() bdata = models.DateField(auto_now=True) # 创建时间 bread = models.IntegerField(default=0) # 阅读数 bup = models.IntegerField(default=0) # 点赞数 b_low = models.IntegerField(default=0) # 踩数 bcomment = models.CharField(max_length=200,null=True,blank=True) # 评论数 isDelete = models.BooleanField(default=False) # 是否删除 buserinfo = models.ForeignKey('blog_login.UserInfo') # 关联外键 def __str__(self): return self.btitle

urls.py

from django.conf.urls import include, url from blog_app import views urlpatterns = [ url(r'^$',views.index), url(r'^index/$',views.index), url(r'^blog_list/$',views.blog_list), ]

views.py

from django.shortcuts import render from blog_app.models import * # Create your views here. def index(request): return render(request,'index.html') # 获取列表 def blog_list(request): # 获取 blist_info = BlogView.objects.all() b_order = blist_info.order_by('-id') # 做个排序，按先后顺序来 return render(request,'blog_list.html',{'blist_info':blist_info,'b_order':b_order})

前端blog_list.html

这是根据前面写的前端魔改出来的，看起来是不是大了很多？实际上它还能更大，但为了给自己留条后路，这只是初稿，咳咳。。。

{% extends 'index.html' %} {% block content %} <div class="row"> <div class="col-md-9 col-md-push-3"> {% block blog %} <div class="b_list" style="margin-left: 0"> {% if b_order %} {% for foo in b_order %} {% if foo.isDelete %} <p>不好意思，正在绞尽脑汁创作中~</p> {% else %} <ul class="list-group"> <li class="list-group-item" style="height: 80px;border: 0;border-bottom: 1px #b9def0 solid"> <span class="badge">{{ foo.bread }}</span> <a href="/blog_detail_{{ foo.id }}/" style="font-size: 24px">{{ foo.btitle }}</a> <div> <div style="margin-top: 6px"> <span> <p style="font-size: 12px;float: left;margin-bottom: 0">创作于 {{ foo.bdata }}</p> </span> </div> <div style="margin-left: 150px;opacity: 0.7;border: 0;height: 15px"> <span class="glyphicon glyphicon-thumbs-up" aria-hidden="true" style="height: 6px"></span> {{ foo.bup }} </div> </div> </li> </ul> {% endif %} {% endfor %} {% else %} <p>不好意思，正在绞尽脑汁创作中~</p> {% endif %} </div> {% endblock %} </div> <div class="col-md-3 col-md-pull-9"> </div> </div> <style> .b_list{ width: 80%; float: left; margin-left: 30px; } </style> {% endblock %}

展示一下页面—— 右边是列表，左边是放博主的一些小东西的，目前先空着，等我想想要做什么，先把目前的做完。

接下来就回到index.html里加个链接以便跳转

详情页detail

上面的工作完成后，就该写一下详情页了，东西有点多，标题，日期，内容，点赞，点踩，评论，左上角返回按钮。。。嗯，我深恶痛绝的前端排版。。。

{% extends 'blog_list.html' %} {% block blog %} <a href="/blog_list/"><< 返回列表</a> <div class="page-header"> <h1 style="color: #5cb85c"> {{ b_detail.btitle }} </h1> <div style="margin: 0;"> <span style="opacity: 0.7;font-size: 12px;">发布日期: {{ b_detail.bdata }}</span> <span style="opacity: 0.7;font-size: 12px;margin-left: 100px;margin-right: 100px">阅读数: {{ b_detail.bread }}</span> <a><span class="glyphicon glyphicon-thumbs-up" aria-hidden="true" style="height: 6px;"></span> {{ b_detail.bup }}</a> <a style="margin-left: 20px"><span class="glyphicon glyphicon-thumbs-down" aria-hidden="true" style="height: 6px;"></span> {{ b_detail.b_low }}</a> </div> </div> <div> <p>{{ b_detail.btext | safe }}</p> </div> <div> <nav aria-label="..." style="margin-top: 100px"> <ul class="pager"> <li class="previous"><a href="#"><span aria-hidden="true">&larr;</span> 上一篇</a></li> <li class="next"><a href="#">下一篇 <span aria-hidden="true">&rarr;</span></a></li> </ul> </nav> </div> <div> 评论区 </div> {% endblock %}

页面展示——

这里也暂时先这样了，左边是在blog_list.html页面完成，右边是blog_detail页面。

因为我发现评论留言必须重新写个数据库表给它，然后建立外键，所以也暂时只能搁置了。

本来想放后端代码的，但还有很多地方没有完善，问题也还没解决，现在也凌晨3点了，两天没发上去了，就先把这份发出来，明天继续。

系列链接——

新手用python Django 创建个人博客的第一天

新手用python Django 创建个人博客的第二天

新手用python Django 创建个人博客的第三天

新手用python Django 创建个人博客的第四天