一、markdown

  1. 安装markdown2

    pip install markdown2
  2. 应用markdown2

    进入blog APP,创建templatetags文件夹,在文件夹内创建__init__.py,custom_markdown.py

  3. 修改custom_markdown.py

    import markdown2
    from django import template
    from django.template.defaultfilters import stringfilter
    from django.utils.encoding import force_unicode
    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_unicode(value),
    extras=['code-friendly',
    'fenced-code-blocks']
    ))
  4. 在模板中添加markdown:

    {% extends "base.html" %}
    {% load custom_markdown %} {% block main%}
    <p>
    {{ post.content|custom_markdown }}
    </p>
    {% endblock %}

现在我们可以使用markdown的语法了,如果需要代码高亮,我们需要使用highlight.js

二、代码高亮

  1. 下载highlight.js

    官网地址https://highlightjs.org/,选择你需要的语言,下载即可。

  2. 使用highlight.js

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

现在浏览,代码可以高亮显示了。

三、后台添加markdown功能,可以用pagedown

  1. 安装pagedown

    pip install django-pagedown
  2. 修改setting.py,添加应用

    INSTALLED_APPS = (
    ...
    'pagedown',
    )
  3. 设置form.py

    from django import forms
    from pagedown.widgets import AdminPagedownWidget
    from models import Article class ArticleForm(forms.ModelForm):
    content = forms.CharField(widget=AdminPagedownWidget(), required=False,
    label='') class Meta:
    model = Article
    fields = '__all__'
  4. 设置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了

使用markdown及highlight的更多相关文章

  1. github page+jekyll搭博客初体验

    div.oembedall-githubrepos { border: 1px solid #DDD; list-style-type: none; margin: 0 0 10px; padding ...

  2. [转]The Best Plugins for Sublime Text

    Source: http://ipestov.com/the-best-plugins-for-sublime-text/ Good day, everyone! I tried to collect ...

  3. (转)rvm安装与常用命令

    rvm是一个命令行工具,可以提供一个便捷的多版本ruby环境的管理和切换. https://rvm.io/ 如果你打算学习ruby/rails, rvm是必不可少的工具之一. 这里所有的命令都是再用户 ...

  4. 最好的Sublime Text插件集合

    阅读目录 WebInspector Emmet Git GitGutter & Modific Sublimall AllAutocomplete SublimeREPL DocBlockr ...

  5. React项目(一):markdown编辑器

    在之前的React官网教程中,提到了用Remarkable为插件的markdown评论框.现在就来正儿八经地用另外一个插件marked.js做一个markdown编辑器吧! 准备工作 或许在做之前,应 ...

  6. 【四】搭建Markdown的编辑器

    本系列有五篇:分别是 [一]Ubuntu14.04+Jekyll+Github Pages搭建静态博客:主要是安装方面 [二]jekyll 的使用 :主要是jekyll的配置 [三]Markdown+ ...

  7. 【三】用Markdown写blog的常用操作

    本系列有五篇:分别是 [一]Ubuntu14.04+Jekyll+Github Pages搭建静态博客:主要是安装方面 [二]jekyll 的使用 :主要是jekyll的配置 [三]Markdown+ ...

  8. [译文]选择使用正确的 Markdown Parser

    以下客座文章由Ray Villalobos提供.在这篇文章中Ray将要去探索很多种不同的Markdown语法.所有的这些MarkDown变种均提供了不同的特性,都超越传统的Markdown语法,却又相 ...

  9. markdown命令语法

    markDown作为一款很好用的文档编写工具,具体的用法如下: # Markdown syntax---**粗体***斜体****粗体加斜体*** > 引用>> 二级引用 # 一级标 ...

随机推荐

  1. Java ArrayList Sort

    Collections.sort(hits_list, new Comparator<ScoreDoc>(){ @Override public int compare(ScoreDoc ...

  2. 你想成为优秀的Java程序员吗?

    Java是全世界最受欢迎的3大编程语言之一,它可以开发出许多实用的WEB应用程序和桌面应用程序,更重要的一点,Java是跨平台的语言——编写一次,可以再任何地方运行.另外,Java也很容易入门,如果你 ...

  3. 第二百八十四天 how can I 坚持

    又是一个周一.今天感觉过得好艰辛啊,幸好晚上程秀通过生日请客,吃了顿大餐,还拿回了一瓶酒.哈哈. 其他也没什么了.晚上玩的挺好.不过,回来,老是渴,一直想喝水,现在是又困,又累啊,睡觉了.

  4. Linux里实用命令之添加行号、文本和语法高亮显示

    写在前面的话 本博主我,强烈建议,来看此博文的朋友们,都玩玩. 最好,在刚入门的时候呢,不加行号,不玩文本和语法高亮显示,以后会深有体会.磨炼自己! 步骤一:进入 /etc/virc配置文件 步骤二: ...

  5. Base64编解码(C++版)

    #include <string> using namespace std; class ZBase64 { public:     /*编码     DataByte         [ ...

  6. bitmap的实现方法

    bitmap是一个十分有用的结构.所谓的Bit-map就是用一个bit位来标记某个元素对应的Value, 而Key即是该元素.由于采用了Bit为单位来存储数据,因此在存储空间方面,可以大大节省. 适用 ...

  7. codeforces 630R Game

    R. Game time limit per test 0.5 seconds memory limit per test 64 megabytes input standard input outp ...

  8. Netty笔记

    1 基本介绍 Bootstrap Netty应用程序通过设置 bootstrap(引导)类开始,该类提供了一个用于应用程序网络层配置的容器.Bootstrap有两种类型,一种是用于客户端的Bootst ...

  9. ECSHOP数据表结构完整仔细说明教程

    From:http://www.ecshop119.com/ecshopjc-868.html s_account_log //用户账目日志表 字段 类型 Null 默认 注释 log_id medi ...

  10. hadoop 关闭进程时报错no 进程 to stop

    前两天和朋友李天王吃饭的时候,聊到了一个hadoop的运维的很简单问题,感觉很有意思,以前也没有注意过,现在加以重现和整理.   感谢李天王的分享....   翻看了yarn-deamon.sh st ...