核心点
admin组件的调用与使用- boot设置整体首页样式
- 导航顶部
登陆与未登陆情况两种样式 时区的设置方法- 每条新闻
展示作者、发布时间、点赞评论数….
效果预览
设置admin组件
自动创建路由path(‘admin/’, admin.site.urls),
- 先要create一个supper账户 运行manage.py 创建
- 在对应app内的 admin.py中 导入数据库表
- 图形化操作录入数据 登陆admin页面
'''对应app内的 admin.py'''
from blog import models
admin.site.register(models.UserInfo) # 创建的每个数据表必须导入,否则无法正常使用
admin.site.register(models.Blog)
...
'''数据库每个字段可以加入verbose_name=自定义显示名'''
# title = models.CharField(max_length=50, verbose_name='文章标题')时区设置
现实每条新闻的录入时间时如果不设置时区，那么默认美国时区
设置方法：
setting.py
# 将原本时区修改到上海
TIME_ZONE = 'Asia/Shanghai'文章数据表
lass Article(models.Model): # 文章表
nid = models.AutoField(primary_key=True)
title = models.CharField(max_length=50, verbose_name='文章标题')
desc = models.CharField(max_length=255, verbose_name='文章描述')
create_time = models.DateTimeField(verbose_name='创建时间', auto_now_add=True)
content = models.TextField() # 文章内容
# 记录 评论数、点赞数、踩数
comment_count = models.IntegerField(verbose_name='评论数', default=0)
up_count = models.IntegerField(verbose_name='点赞数', default=0)
down_count = models.IntegerField(verbose_name='踩数', default=0)
user = models.ForeignKey(verbose_name='作者', to='UserInfo', to_field='nid', on_delete=models.CASCADE)
category = models.ForeignKey(verbose_name='文章分类', to='Category', to_field='nid', null=True, on_delete=models.CASCADE)
tags = models.ManyToManyField( # 自定义中间模型
to='Tag',
through='Article2Tag',
through_fields=('article', 'tag'),
)视图部分
# 直接将新闻的整个列表传过去
def index(request):
article_list = models.Article.objects.all()
return render(request, 'index.html', {'article_list': article_list})HTML
用户登陆时候顶部右侧现显示能菜单
用户未登陆时候顶部右侧显示登陆注册
调用头像图标时候，前缀必须带上media/ 才能找到对应资源！！！！！
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="/static/blog/bs/css/bootstrap.css">
<script src="/static/blog/js/jquery-3.3.1.min.js"></script>
<script src="/static/blog/bs/js/bootstrap.min.js"></script>
<style>
#user_icon {
font-size: 18px;
margin-right: 10px;
vertical-align: -3px;
}
.pub_info{
margin-top: 10px;
}
</style>
</head>
<body>
{# 导航 #}
<nav class="navbar navbar-default">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">博客园</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class="active"><a href="#">随笔 <span class="sr-only">(current)</span></a></li>
<li><a href="#">新闻</a></li>
<li><a href="#">博文</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
{# 判断是否登陆 #}
{% if request.user.is_authenticated %}
{# 加上一个用户头像图标 #}
<li><a href="#"><span id="user_icon"
class="glyphicon glyphicon-user"></span>{{ request.user.username }}</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
aria-expanded="false">功能 <span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">修改密码</a></li>
<li><a href="#">修改头像</a></li>
<li><a href="/logout/">注销</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</li>
{% else %}
<li><a href="/login/">登陆</a></li>
<li><a href="/register/">注册</a></li>
{% endif %}
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
{# 主体 #}
<div class="container-fluid">
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
{# 首页中间部分 #}
<div class="article_list">
{% for article in article_list %}
<div class="article-item">
<h5><a href="">{{ article.title }}</a></h5>
<div class="article-desc">
<span class="media-left">
{# 路径前面必须 ！！！！带media/#}
<a href=""><img width="56" height="56" src="media/{{ article.user.avatar }}" alt=""></a>
</span>
<span class="media-right">
{{ article.desc }}
</span>
</div>
<div class="small pub_info"> <!--样式设置小一点方便与摘要的区别-->
<span><a href="">{{ article.user }}</a></span>
<span>发布于 {{ article.create_time|date:'Y-m-d H:i' }}</span>
<span class="glyphicon glyphicon-comment"></span>评论({{ article.comment_count }})
<span class="glyphicon glyphicon-thumbs-up"></span>点赞({{ article.up_count }})
<span class="glyphicon glyphicon-thumbs-down"></span>踩({{ article.down_count }})
</div>
</div>
<hr>
{% endfor %}
</div>
</div>
<div class="col-md-3"></div>
</div>
</body>
</html>