17python

实战:利用Django开发部署自己的个人博客(13)Markdown模块解析Markdown代码

使用Django编写个人博客是一件很轻松的事,Django给我们提供了很多功能模块,让我们大大减少了代码的编写,让我们把更多的精力集中到程序的逻辑开发上,让我们有更多的时间去陪家人、陪孩子、和打游戏。 发自心的感谢:感谢Django,感谢开源界的程序员及一切。

引入Markdown

博客有了,不过文章内容页上只显示的是字符,并没有任何美化的效果,比如插入图片、加入一些样式等,解决这个问题做为一个程序员首先就会想到Markdownpython3中有Markdown模块,我们先来安装一下:

pip3 install markdown

使用Markdown

➜  ~ python3
Python 3.6.1 (v3.6.1:69c0db5050, Mar 21 2017, 01:21:04) 
[GCC 4.2.1 (Apple Inc. build 5666) (dot 3)] on darwin
Type "help", "copyright", "credits" or "license" for more information.
>>> from markdown import markdown
>>> s = '###这里是标题'
>>> m = markdown(s)
>>> m
'<h3>这里是标题</h3>'

额,又是这么简单,接下来就是引入到Django中使用了。 插播一条广告:如果你对Markdown语法不了解,请看下边的博文。 Markdown 语法学习总结

Django模板中输出html

启动服务器,我们添加一篇带有markdown语法的文章:

#Markdown文章测试哦
##Markdown文章测试哦Markdown文章测试哦

1. Markdown文章测试哦
2. Markdown文章测试哦
3. Markdown文章测试哦


<h1>html测试哦</h1>
<br/>
<h3>html测试哦html测试哦html测试哦</h3>

打开这个篇博文的页面,我们会看到如下效果:

发现Markdown语法只是原样输出,并没有解析,还有就是html代码被转义了,没有在网页中显示出样式,好了,发现两个问题,我们逐一解决。

关闭Django模板中的html转义

关闭Django模板中的html转义有两种方法:

<p>这行不会被转义</p>: {{ data }}
<p>这行会被自动转义</p>: {{ data|safe }}

这种是比较短小的html情况下使用的过滤器safe来关闭html转义,如果是大段的html代码比如博文,我们使用下边的方法:

   {% autoescape off %}
    {{ article.content }}
   {% endautoescape %}

其中article.content输出的html代码就不会被转义了,网页上就会显示出具体的样式。我们试下。

打开bolg.html,修改模板内容渲染:

{% autoescape off %}
    {{ article.content }}
{% endautoescape %}

保存后,我们刷新一下页面看看,

html代码已经被正常输出了,网页上显示了还的标题样式,但我们发现markdown的语法还没有被解析成html代码。

使用Django自定义过滤器+Markdown模块解析Markdown代码

创建自定义过滤器文件myblog.templatetags.mytags.py,并在相同目录中添加__init__.py空文件即可。

先编写mytags.py过滤器代码:

#coding=utf-8
#导入基本配置文件
from django import template
#导入markdown模块
from markdown import markdown
#引入过滤器
register = template.Library()

#自定义过滤器编写

@register.filter
def toMarkdown(str):
    ####markdown解析器
    return markdown(str)

然后我们在模板中引用一下这个过滤器,

编辑修改blog.html的代码,在头部添加:

{% load mytags %}

表示加载自定义的过滤器,修改渲染文章内容处的代码,添加过滤器,过滤器的用法很简单,具体看代码:

{% autoescape off %}
    {{ article.content|toMarkdown }}
{% endautoescape %}

保存后,我们刷新文章页查看一下:

到此,markdown已经在我们的博客中完美引用了,当然做为一个程序员我们经常和代码打交道,博客中少不了要贴代码,所以代码美化也是少不了的。 这里我推荐一个代码美化的js:highlight.js去他的官方网站上下载一个喜欢的js和css样式,然后加到blog.html中,大体上如下:

<link rel="stylesheet" href="/static/highlight/styles/atom-one-light.css">
<script src="/static/highlight/highlight.pack.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

具体文件请按目录保存,这样你的博客中的代码就有了自己的样式,而不是很单一的颜色了。

好了,这节结束,感觉很简单的东西,怎么写了么这长。。。。。。有问题请在下边留言给俺

本文源码下载:

相关标签
About Me
py_sky
你那么喜欢看“干货”,是因为你根本不想下什么功夫;你自以为的极限,其实只是别人的起点。
Category
标签云
站点统计

本站现有博文81篇,共被浏览31664

据官网介绍,2020年4月Python2.7将不会被维护!距离Python2.7停止维护还有693天!

热门文章
文章归档
回到顶部