Django搭建博客网站(四)
最后一篇主要讲讲在后台文章编辑加入markdown,已经在文章详情页对markdown的解析.
Django搭建博客网站(一)
Django搭建博客网站(二)
Django搭建博客网站(三)
要用到的package
- django-pagedown
- markdown2
django-pagedown
用来在后台生成markdown编辑器,markdown2
则是用来将markdown解析成html显示在网页上.
install
$ pip install django-pagedown
$ pip install markdown2
后台markdown编辑器
使用django-pagedown
之前,去它的github地址看了一下.
- Get the code: pip install django-pagedown
- Add pagedown to your INSTALLED_APPS
- Make sure to collect the static files:
python manage.py collectstatic --noinput
(and if you are working in a development environment, make sure you are properly serving your static files)
可以知道安装了package,还要将django-pagedown
安装到项目中:
# settings.py
INSTALLED_APPS = [
‘pagedown‘,
‘post.apps.PostConfig‘,
‘django.contrib.admin‘,
‘django.contrib.auth‘,
‘django.contrib.contenttypes‘,
‘django.contrib.sessions‘,
‘django.contrib.messages‘,
‘django.contrib.staticfiles‘,
]
但是运行上面第三点里面的命令,出现了错误,最后上stackoverflow查了一下,原来是在settings.py
里面还得添加设置:
# settings.py
BASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))
STATIC_ROOT = os.path.normpath(os.path.join(BASE_DIR, ‘staticfiles‘))
STATICFILES_DIRS = (
os.path.join(BASE_DIR, ‘static‘),
)
此时再运行python manage.py collectstatic --noinput
就没问题了.
接下啦自然就是在后台添加markdown编辑器了,其实只需要让文章的内容部分支持markdown就行了,也就是post
这个model里的post_content
,修改admin.py
文件就够了:
# admin.py
from django.contrib import admin
from .models import Post, PostTag
from pagedown.widgets import AdminPagedownWidget
from django import forms
class PostForm(forms.ModelForm):
post_content = forms.CharField(widget=AdminPagedownWidget(show_preview=True))
class Meta:
model=Post
fields=‘__all__‘
class PostAdmin(admin.ModelAdmin):
form = PostForm
filter_horizontal = (‘posttag‘,)
admin.site.register(Post,PostAdmin)
admin.site.register(PostTag)
show_preview
设置成True
会在编辑的时候显示预览.
此时运行项目再进后台,就能使用markdown编辑文章内容了.
markdown解析
当后台使用markdown编辑后,存入数据库的文章内容是markdown代码,直接传到网页上显示的话,也是显示的markdown代码.
在django里面允许每个app为模板添加过滤器.
这里就可以通过过滤器来实现使用markdown2
对markdown的解析.
django的过滤器功能,在每个app的templatetags
文件夹下面,需要自行创建,注意创建的时候是一个package,而不是dictionary,也就是包含一个__init__.py
文件.
然后,在templatetags
文件夹下面创建一个djangomarkdown.py
:
# post/templatetags/djangomarkdown.py
import markdown2
from django import template
from django.template.defaultfilters import stringfilter
from django.utils.safestring import mark_safe
register = template.Library()
@register.filter(is_safe=True)
@stringfilter
def djangomarkdown(value):
return mark_safe(markdown2.markdown(value,
extras=["fenced-code-blocks", "cuddled-lists", "metadata","tables", "spoiler"]))
既然创建了一个过滤器,那么要怎么用呢?
其实是直接在html文件里边就可以用的,不过要先在html文件里面加载(以post.html
为例):
{% extends ‘post/base.html‘ %}
{% load djangomarkdown %}
{% block title %}
<title>{{ post.post_title }}</title>
{% endblock %}
{% block content %}
<div class="container">
<div class="page-header"><h1>{{ post.post_title }}</h1></div>
<div class="description">
<span class="col-md-2"><a href="{% url ‘post:user‘ ‘Chain‘ %}">Chain</a></span><span
class="col-md-2">{{ post.pub_date }}</span>
{% if post.pub_date < post.change_date %}
<span class="col-md-4">last change:{{ post.change_date }}</span>
{% endif %}
</div>
<br>
<hr>
<div class="content">
{{ post.post_content|djangomarkdown }}
</div>
<br>
<hr>
<div class="btn-group" role="group" aria-label="...">
{% for tag in post.posttag.all %}
<a href="{% url ‘post:tag‘ tag.tag_name %}">
<button type="button" class="btn btn-info">#{{ tag.tag_name }}</button>
</a>
{% endfor %}
</div>
</div>
{% endblock %}
先在文件开头加载自定义的过滤器,然后html里面就可以直接使用了.