【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的预览啦~~

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值