新手学习——用django搭建个人博客_day4

一、 分页展示

当你的博客拥有的文章很多时候，对文章进行分页就很有必要了。这里我们使用Django自带的分页模块进行分页处理。

1. views视图函数

website/blog/views.py 直接注释了…

from blog.models import Categorys,Tags,Article
from django.core.paginator import  Paginator,PageNotAnInteger,EmptyPage
from django.shortcuts import render

def index(request):
    article_list = Article.objects.all()
    paginator = Paginator(article_list, 1) # arg1-要分页的数据， arg2-每页最大容量， arg3-最后一页少于n条时合并入上一页

    try:
        # GET请求方式，get()获取指定Key值所对应的value值
        # 获取page的值，如果没有，则设置使用默认值1
        num = request.GET.get('page','1')
        # 获取第几页
        article_list = paginator.page(num)
    except PageNotAnInteger:
        # 如果输入的页码数不是整数，那么显示第一页数据
        article_list = paginator.page(1)
    except EmptyPage:
        # 输入的是大于最大分页数的整数，则返回最后一页
        article_list = paginator.page(paginator.num_pages)

    # 获取当前页前后3页的页码。
    total = paginator.num_pages
    current_page = article_list.number
    if total-current_page >=3:
        right = current_page + 3
    else:
        right = total
    if current_page - 1 >=3:
        left = current_page -3
    else:
        left = 1
    page_range = range(left,right)

    return render(request, 'index.html', {'article_list': article_list,'page_range':page_range})

2. index模板的 {% block content %}块增加以下内容

website/templates/index.html:

<nav style="text-align: center">
    <ul class="pagination ">
    {% if article_list.has_previous %}
        <li><a href="/blog/?page={{ article_list.previous_page_number }}">上一页</a></li>
    {% else %}
        <li class="disabled"><a href="#">上一页</a></li>
    {% endif %}

    {% for page in page_range %}
        {% if page != article_list.number %}
            <li><a href="/blog/?page={{ page }}">{{ page }}</a></li>
        {% else %}
            <li class="disabled"><a href="/blog/?page={{ page }}">{{ page }}</a></li>
        {% endif %}
    {% endfor %}

    {% if article_list.has_next%}
        <li><a href="/blog/?page={{ article_list.next_page_number }}">下一页</a></li>
    {% else %}
        <li class="disabled"><a href="#">下一页</a></li>
    {% endif %}
    </ul>
    </nav>

二、 详情页展示

1. 首先配置博客详情页

配置blog应用的urls, website/blog/urls:

urlpatterns = [
    url(r'^$', views.index, name='index'),
    url(r'^(?P<blog_id>[0-9]+)$', views.article, name='article'),  # 新增博客详情页的url配置
]

配置对应的详情页的视图函数, website/blog/views.py:

def article(request, blog_id):
    article = Article.objects.get(id=blog_id)
    article.page_view = article.page_view + 1   # 每次访问博客文章时候，博客访问量+1
    article.save()    # 博客文章的访问量发生了改变，记得讲改变后的结果写入数据库

    return render(request,'article.html',{'article': article})

修改article.html来展示文章详情页模板,website/templates/article.html:

{% extends 'base.html' %}
{% block title %}博客详情页{% endblock %}

{% block content %}
    <h3>博客ID为{{ article.id }}的博客题目: {{ article.title }}</h3>
{% endblock %}

现在启动项目，输入文章的URL就可以查看对应文章了，结果：

2. 在首页中利用反向解析来访问博客文章详情页

先来理解下什么是反向解析，反向解析可以这么理解：给你的url路由起一个别名，然后在使用对应的url时候就可以用这个别名来代替它对应的url，它典型的作用就是当你的网站有太多的url路由时候，使用反向解析可以避免因为正则匹配不正确导致的路由分发错误。
要使用反向解析，首先需要在django项目中给应用注册命名空间。例如你想使用blog应用的文章详情页article的url，你可以在模板中正向拼接，href = “/blog/{{article.id}}”, 也可以使用反向解析href="{% url “blog:article” article.id %}’"

先给我们的blog应用注册命名空间，你可以在项目级的urls中配置，或者你可以在应用级别的ursl中配置：
website/website/urls.py:

url(r'^blog/', include('blog.urls', namespace='blog') ),  # include路由转发

或者website/blog/urls.py中给app_name命名:

app_name = 'blog'

接着找到我们index.html模板中文章标题的href链接，之前我们设置为了#，现在我们调整一下，利用反向解析来跳转访问博客文章的详情页。
website/templates/index.html:

<h3>文章标题:&nbsp;&nbsp;<a href="{% url "blog:article" article.id %}">{{ article.title }}</a></h3>

现在启动应用就可以在博客首页中点击文章题目实现跳转了。

3. 完善博客详情页展示

博客文章应该展示所有内容，重新修改article模板，
website/templates/article.html:

{% extends 'base.html' %}
{% block title %}博客文章{% endblock %}

{% block content %}
    <div class="container">
        <div class="row">
            <div class="col-md-9">
                <h1>{{ article.title }}</h1>
                <p>
                    <strong>分类：&nbsp;&nbsp;
                    {% for category in article.categorys.all %}
                        {{ category.category_name }}&nbsp;&nbsp;
                    {% endfor %}

                    <br/>标签：&nbsp;&nbsp;
                    {% for tag in article.tags.all %}
                        {{ tag.tag_name }}&nbsp;&nbsp;
                    {% endfor %}

                    <br/>作者：&nbsp;&nbsp;{{ article.auth }}&nbsp;&nbsp;&nbsp;&nbsp;
                    创建时间：&nbsp;&nbsp;{{ article.created_time|date:'Y年m月d日' }}
                    &nbsp;&nbsp;&nbsp;&nbsp;浏览量：
                        &nbsp;&nbsp;{{ article.page_view }}
                </strong>
                </p>
                {% if article.img %}
                <div><img src="{{ article.img.url }}" alt="博客配图" width="50%"/></div>
                {% endif %}
                <hr />
                <p>
                    {{ article.body|safe }}
                </p>
            </div>
        </div>
    </div>
{% endblock %}

结果：

三、 博客正文利用markdown编辑及预览

上面可以看到博客正文的内容很乱，没有排版，现在我们修改代码让其前端页面展示的效果变为markdown语法格式（markdown就是一种排版的语法格式，csdn写文章的一种格式就是markdown）

1. 让前端正文显示为markdown格式.

首先需要给环境安装包，我这里安装的是django-markdownx，

>>>pip install django-markdownx  # 它会自动为你安装markdown

接着需要给Article添加一个方法，这个方法将我们admin后台管理输入的博客正文修改为markdown的格式，然后传给前端页面。
website/blog/models.py:

from markdownx.utils import markdownify   # 先导入包

class Article(models.Model):
   ....
   def text_markdownify(self):    # 在Article中加入该方法，markdownify可以将纯文本修改为markdown格式
       return markdownify(self.body)  # 把博客文章的纯文本用markdownx处理
   ....

website/templates/article.html:

{#      {{ article.body}}        #}   # 替换为下述代码，
 {{ article.text_markdownify | safe }}     # 这边一定要记得加上safe过滤器，不加显示的都是html格式的文本

2. admin 编辑页面即时显示markdown

https://github.com/neutronX/django-markdownx 官方教程
首先website/website/settings.py:

INSTALLED_APPS = [
	'''
    'markdownx',
]

给配置路由 website/website/urls.py:

url(r'^markdownx/', include('markdownx.urls')),

修改模型website/blog/models.py:

from markdownx.models import MarkdownxField

class Article(models.Model):
    '''
    # body = models.TextField(verbose_name='正文')
    body = MarkdownxField(verbose_name='正文')
    '''

admin进行注册 website/blog/admin.py:

from markdownx.admin import MarkdownxModelAdmin

class ArticleAdmin(MarkdownxModelAdmin):  # MarkdownxModelAdmin继承自admin.ModelAdmin
    list_display = ['title','auth','created_time','update_time','abstract']

admin.site.register(Article, ArticleAdmin)

admin博客文章效果：

追加: 插件django-mdeditor使用以后发现更方便。
https://www.cnblogs.com/crime/p/11022714.html