【django】搭建博客教程(3)——markdown以及highlight

一.工作环境

ubuntu14.04

python2.7 + django1.8

二.markdown你的文章

1.安装markdown2

#首先安装markdown2
pip install markdown2

2.应用markdown2

a. 进入应用的目录，执行下面操作：

$ mkdir templatetags
$ touch __init__.py
$ touch custom_markdown.py

b.修改custom_markdown.py：

import markdown2
from django import template
from django.template.defaultfilters import stringfilter
from django.utils.encoding import force_text
from django.utils.safestring import mark_safe

register = template.Library()

@register.filter(is_safe=True)
@stringfilter

def custom_markdown(value):
return mark_safe(markdown2.markdown(force_text(value), extras=["fenced-code-blocks", "cuddled-lists", "metadata", "tables", "spoiler"]))

c. 在模板中添加markdown：

{% extends "base.html" %}
{% load custom_markdown %}

{% block content %}
……
<p>
{{ post.content|custom_markdown }}
</p>
……
{% endblock %}

至此，我们已经可以使用markdown的语法啦～

不过暂时还没有代码高亮功能，我们需要自己添加，这里我们使用highlight.js：

3.添加代码高亮

在我们base.html的头部添加：

<link rel="stylesheet" href="http://cdn.bootcss.com/highlight.js/8.0/styles/monokai_sublime.min.css">

<script src="http://cdn.bootcss.com/highlight.js/8.0/highlight.min.js"></script>

<script>hljs.initHighlightingOnLoad();</script>

此处直接使用cdn，很方便，当然你也可以自己去官网下载到本地～

三.后台添加markdown功能以及预览

1.安装pagedown

pip install django-pagedown

2.修改setting.py，添加应用

INSTALLED_APPS = (
...
'pagedown',
...
)

3.设置form.py

在需要该编辑器的form中进行设置。以数据库表Article为例，在我们的Blog的aap中，models中已经定义好Article表了。

创建forms.py，添加如下：

from models import Article
from pagedown.widgets import AdminPagedownWidget
from django import forms

class ArticleForm(forms.ModelForm):
content = forms.CharField(widget=AdminPagedownWidget())

class Meta:
model = Article

4.设置admin.py

修改admin.py 如下：

from django.contrib import admin
from blog.models import Article
from forms import ArticleForm

class ArticleAdmin(admin.ModelAdmin):
form = ArticleForm

admin.site.register(Article, ArticleAdmin)

这样子，我们到后台就可以看到markdown的预览啦～～