1 首页样式(不用太关注)
2 开启meida的访问
-setting中配置MEDIA_ROOT=os.path.join(BASE_DIR,'media')
-FileField(upload_to='avatar/'),以后上传的头像都放在media下的avatar文件夹下
-re_path('^media/(?P<path>.*?)$', serve,kwargs={'document_root':settings.MEDIA_ROOT}),
-域+'media/avatar/a.jpg'
3 个人站点路由设计
0 伪静态
1 为了搜索引擎优化,动态页面做成伪静态
https://www.cnblogs.com/Zh1z3ven/p/14624772.html
2 xx.html结尾的网页,权重高, p/14624772 p/14624772.php p/14624772.jsp 权重低
3 百度是个大爬虫,一刻不停的在互联网上爬取页面----》爬完存到自己的库中---》你们百度搜索---》去百度的库中搜---》返回你看到
4 谷歌需要FQ
1 左侧查询和个人主页路由整合
路由整合
re_path('^(?P<username>w+)/(?P<condition>category|tag|archive)/(?P<params>.*).html$', views.personal_site),
视图函数
def personal_site(request, username, **kwargs):
user = models.UserInfo.objects.filter(username=username).first()
if user:
article_list = user.blog.article_set.all()
if kwargs:
condition = kwargs.get('condition')
params = kwargs.get('params')
if condition == 'category':
article_list = article_list.filter(category_id=params)
elif condition == 'tag':
article_list = article_list.filter(tag__id=params) #跨表了
elif condition == 'archive':
param_year, param_month = params.split('/')
article_list = article_list.filter(create_time__year=param_year, create_time__month=param_month)
return render(request, 'site.html', locals())
else:
return render(request, '404.html')
2 左侧标签,分类,归档写成inclusion_tag
left.py
from django import template
register = template.Library()
from blog import models
from django.db.models.functions import TruncMonth
from django.db.models import Count
left.html
<div>
<div class="panel panel-success">
<div class="panel-heading">
<h3 class="panel-title">我的标签</h3>
</div>
<div class="panel-body">
{% for tag in tag_list %}
<p><a href="/{{ username }}/tag/{{ tag.2 }}.html">{{ tag.1 }}({{ tag.0 }})</a></p>
{% endfor %}
</div>
</div>
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title">我的分类</h3>
</div>
<div class="panel-body">
{% for category in category_list %}
<p>
<a href="/{{ username }}/category/{{ category.id }}.html">{{ category.name }}({{ category.count }})</a>
</p>
{% endfor %}
</div>
</div>
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title">随笔档案</h3>
</div>
<div class="panel-body">
{% for month in month_list %}
<p>
<a href="/{{ username }}/archive/{{ month.0|date:'Y/m' }}.html">{{ month.0|date:'Y年m月' }}({{ month.1 }})</a>
</p>
{% endfor %}
</div>
</div>
</div>
使用
{% load left %}
{% left_inclusion_tag username %}
3 文章详情页面搭建
#div_digg {
float: right;
margin-bottom: 10px;
margin-right: 30px;
font-size: 12px;
125px;
text-align: center;
margin-top: 10px;
}
.diggit {
float: left;
46px;
height: 52px;
background: url(/static/img/upup.gif) no-repeat;
text-align: center;
cursor: pointer;
margin-top: 2px;
padding-top: 5px;
}
.buryit {
float: right;
margin-left: 20px;
46px;
height: 52px;
background: url(/static/img/downdown.gif) no-repeat;
text-align: center;
cursor: pointer;
margin-top: 2px;
padding-top: 5px;
}
.clear {
clear: both;
}
.diggword {
margin-top: 5px;
margin-left: 0;
font-size: 12px;
color: red;
}
4 文章点赞点踩样式
<div id="div_digg">
<div class="diggit action">
<span class="diggnum" id="digg_count">{{ article.up_num }}</span>
</div>
<div class="buryit action">
<span class="burynum" id="bury_count">{{ article.down_num }}</span>
</div>
<div class="clear"></div>
<div class="diggword" id="digg_tips">
</div>
</div>
#div_digg {
float: right;
margin-bottom: 10px;
margin-right: 30px;
font-size: 12px;
125px;
text-align: center;
margin-top: 10px;
}
.diggit {
float: left;
46px;
height: 52px;
background: url(/static/img/upup.gif) no-repeat;
text-align: center;
cursor: pointer;
margin-top: 2px;
padding-top: 5px;
}
.buryit {
float: right;
margin-left: 20px;
46px;
height: 52px;
background: url(/static/img/downdown.gif) no-repeat;
text-align: center;
cursor: pointer;
margin-top: 2px;
padding-top: 5px;
}
.clear {
clear: both;
}
.diggword {
margin-top: 5px;
margin-left: 0;
font-size: 12px;
color: red;
}
5 文章点赞点踩后端
后端
def upanddown(request):
if request.is_ajax():
response = {'status': 100, 'msg': None}
if request.user.is_authenticated:
article_id = request.POST.get('article_id')
is_up = json.loads(request.POST.get('is_up'))
res = models.UpAndDown.objects.filter(article_id=article_id, user=request.user)
if res:
# 点过了
response['status'] = 102
response['msg'] = '你已经点过了'
return JsonResponse(response)
# 事务操作
with transaction.atomic():
if is_up:
models.Article.objects.filter(id=article_id).update(up_num=F('up_num') + 1)
response['msg'] = '点赞成功'
else:
models.Article.objects.filter(id=article_id).update(down_num=F('down_num') + 1)
response['msg'] = '点踩成功'
models.UpAndDown.objects.create(user=request.user, article_id=article_id, is_up=is_up)
return JsonResponse(response)
else:
response['status'] = '101'
response['msg'] = '请去<a href="/login/">登录</a>'
return JsonResponse(response)
前端
$('.action').click(function () {
var is_up=$(this).hasClass('diggit')
var span= $(this).children('span')
$.ajax({
url:'/upanddown/',
method:'post',
//谁(当前登录用户)对那篇文章点赞或点踩
data:{article_id:'{{ article.id }}',is_up:is_up,'csrfmiddlewaretoken':'{{ csrf_token }}'},
success:function (data) {
console.log(data)
$('#digg_tips').html(data.msg)
if (data.status=='100'){
//let num=Number(span.html())+1
span.html(Number(span.html())+1)
}
}
})
})