django中实现Markdown
分为两个部分:
------------后台使用Markdown编辑
------------前端使用Markdown展示
准备工作:
pip install django-mdeditor # 用于后台编辑
pip install markdown # 用于前端显示
INSTALLED_APPS = [
... 省略 ...
'mdeditor',
]
path("mdeditor/", include('mdeditor.urls'))
第一部分:实现后台使用Markdown编辑
修改models中的field的类型,之前是TextField,现在改成MDTextField即可
from django.db import models
from mdeditor.fields import MDTextField # 文章表
class Article(models.Model):
# 文章标题title
title = models.CharField(max_length=64, verbose_name='标题') # 文章内容content
content = MDTextField(default="", editable=True, blank=True) article_picture = models.ImageField(upload_to='img/', verbose_name='封面图')
此时就实现了后台使用Markdown编辑了,如下:

第二部分:实现前端使用Markdown显示
例如,实现文章的详情显示:
原本的操作是,从数据库拿到这篇文章后,直接传递到前端页面进行展示。
其实现在也一样,只不过此时,是把文章内容的HTML标签传递到前端页面中,然后在渲染的时候加上{{ xxx|safe}}就可以了。【如果不加safe的话,会直接显示HTML标签】
如下:
import markdown
from django.shortcuts import render
from app01.models import Article def detail(request): # 拿到文章的id
articleId = request.GET.get('articleId') # 拿到这篇文章
articleDetail = Article.objects.get(id=articleId) # 之前是直接传递这篇文章articleDetail就可以了;
# 而现在先把文章内容articleDetail.content转换成Markdown的HTML标签再传递
articleDetail.content = markdown.markdown(
articleDetail.content,
extensions = [
'markdown.extensions.extra',
'markdown.extensions.codehilite',
'markdown.extensions.toc',
'markdown.extensions.abbr',
'markdown.extensions.attr_list',
'markdown.extensions.def_list',
'markdown.extensions.fenced_code',
'markdown.extensions.footnotes',
'markdown.extensions.md_in_html',
'markdown.extensions.tables',
'markdown.extensions.admonition',
'markdown.extensions.legacy_attrs',
'markdown.extensions.legacy_em',
'markdown.extensions.meta',
'markdown.extensions.nl2br',
'markdown.extensions.sane_lists',
'markdown.extensions.smarty',
'markdown.extensions.toc',
'markdown.extensions.wikilinks'
]
)
return render(request, 'detail.html', locals())
然后在页面渲染的时候加上safe就可以了:
{{ articleDetail.content|safe }}
此时,就可以显示Markdown内容了,但是还是没有代码的语法高亮:

那怎么实现代码高亮呢?
首先,需要安装一下依赖:
pip install Pygments
然后执行:
pygmentize -S monokai -f html -a .codehilite > monokai.css
执行完成后,会生成一个CSS文件:monokai.css,然后把这个CSS文件引入到对应的HTML文件中就可以了,如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>articleDetail</title>
<link rel="stylesheet" href="/static/monokai.css">
<style>
div{
width: 1000px;
margin: 0 auto;
}
</style>
</head>
<body>
<div>
<h2>{{ articleDetail.title }}</h2>
<p>{{ articleDetail.content|safe }}</p>
</div>
</body>
</html>

到此,就全部完成了!
附言:
1. 下面的这些内容是一些扩展,具体可以根据实际情况选择,这些是从 markdown 的官网扩展官网 https://python-markdown.github.io/extensions/查到的

2. 刚才执行的这条命令【pygmentize -S monokai -f html -a .codehilite > monokai.css】,只是其中一个主题而已,还可以换成其他的主题,例如:
# pygmentize -S default -f html -a .codehilite > markdown_highlighy.css
# pygmentize -S default -f html -a .codehilite > default.css
... ...
django中实现Markdown的更多相关文章
- Django 中使用 MarkDown 插件
目录 Django 使用 markdown 插件 1 将 markdown 转化为 html 2 使用 markdown 编辑框 Django 使用 markdown 插件 Python-Markdo ...
- django 项目中使用markdown编辑器
第一步: 修改models.py文件下要显示字段的类型为TextField 第二步:运行命令: python manage.py makemigrations 和 python manage.py ...
- 异步任务队列Celery在Django中的使用
前段时间在Django Web平台开发中,碰到一些请求执行的任务时间较长(几分钟),为了加快用户的响应时间,因此决定采用异步任务的方式在后台执行这些任务.在同事的指引下接触了Celery这个异步任务队 ...
- Mysql事务探索及其在Django中的实践(二)
继上一篇<Mysql事务探索及其在Django中的实践(一)>交代完问题的背景和Mysql事务基础后,这一篇主要想介绍一下事务在Django中的使用以及实际应用给我们带来的效率提升. 首先 ...
- Mysql事务探索及其在Django中的实践(一)
前言 很早就有想开始写博客的想法,一方面是对自己近期所学知识的一些总结.沉淀,方便以后对过去的知识进行梳理.追溯,一方面也希望能通过博客来认识更多相同技术圈的朋友.所幸近期通过了博客园的申请,那么今天 ...
- Django 中url补充以及模板继承
Django中的URL补充 默认值 在url写路由关系的时候可以传递默认参数,如下: url(r'^index/', views.index,{"name":"root& ...
- django中css问题
django中加载的css,js,图片其中js和图片可以加载出来,而css没有效果.原因如下: 这是因为你安装的某些IDE 或者其他更改了注册表导致的系统的注册表\HKEY_CLASSES_ROOT\ ...
- 在Django中进行注册用户的邮件确认
之前利用Flask写博客时(http://hbnnlove.sinaapp.com),我对注册模块的逻辑设计很简单,就是用户填写注册表单,然后提交,数据库会更新User表中的数据,字段主要有用户名,哈 ...
- django中tinymce添加图片上传功能
主要参考以下: https://pixabay.com/en/blog/posts/direct-image-uploads-in-tinymce-4-42/ http://blog.csdn.net ...
- django中migration文件是干啥的
昨天很蠢的问leader git push的时候会不会把本地的数据库文件上传上去,意思是django中那些migration文件修改之后会不会上传. 然后得知不会,因为所有的数据库都存在本机的mysq ...
随机推荐
- MOGDB/openGauss索引推荐及虚拟索引
MOGDB/openGauss 索引推荐及虚拟索引 索引推荐 在 ORACLE 的优化中,可能大家有接触过 SQL Tuning Advisor(SQL 调优顾问,STA),类似的 MOGDB/ope ...
- openGauss每日一练(全文检索)
openGauss 每日一练(全文检索) 本文出处:https://www.modb.pro/db/224179 学习目标 学习 openGauss 全文检索 openGauss 提供了两种数据类型用 ...
- 报名直达丨HarmonyOS开发者创新大赛线下城市交流会来了,约吗?
HarmonyOS开发者创新大赛线下城市交流会 正式开启啦! 在这里,将有专业的讲师 与HarmonyOS开发者们面对面演示开发实操.交流开发心得 还等什么?赶快扫码报名吧~↓↓↓ 城市交流会报名链接 ...
- 学习Source Generators之了解Source Generators的应用场景
前面的文章我们都初步学习了Source Generators的使用方式以及做了一些简单的代码生成工具. 但是Source Generators除了做自动代码生成之外,还能有别的应用场景,本文来了解一下 ...
- Spring Cloud Alibaba 致力于提供微服务开发的一站式解决方案。此项目包含开发分布式应用服务的必需组件-Nacos 、Sentinel等
概述 Spring Cloud Alibaba 致力于提供微服务开发的一站式解决方案.此项目包含开发分布式应用服务的必需组件. 方便开发者通过 Spring Cloud 编程模型轻松使用这些组件来开发 ...
- mysql 必知必会整理—sql 简单语句[二]
前言 简单整理一下sql 排序与过滤. 正文 在这里需要创建一下一个数据库实例. 为了方便直接用docker 创建一下啊,方便简洁. https://hub.docker.com/_/mysql 按照 ...
- 阿里云全站加速DCDN重磅发布!打造新一代加速引擎
简介: 新一代的加速引擎DCDN,安全.高效.可计算 在数字化转型变革逐步深入的当下,安全高效成为企业上云.全球化部署的关键需求. 随着应用场景复杂度不断提升.业务需求差异化发展,为了给企业提供更完善 ...
- 阿里开源自研工业级稀疏模型高性能训练框架 PAI-HybridBackend
简介:近年来,随着稀疏模型对算力日益增长的需求, CPU集群必须不断扩大集群规模来满足训练的时效需求,这同时也带来了不断上升的资源成本以及实验的调试成本.为了解决这一问题,阿里云机器学习PAI平台开 ...
- 比心云平台基于阿里云容器服务 ACK 的弹性架构实践
简介:本文主要探讨比心云平台如何利用阿里云容器服务 ACK,来构建应用弹性架构,进一步优化计算成本. 作者:韩韬|比心技术 前言 应用容器化改造后,不可避免地会面临这样一个问题:Kubernetes ...
- 基于 Flutter 的 Web 渲染引擎「北海」正式开源!
简介: 阿里巴巴历时 3 年自研开发的 Web 渲染引擎北海(英文名:Kraken)正式开源,致力打造易扩展,跨平台,高性能的渲染引擎,并已在优酷.大麦.天猫等业务场景中使用. 作者 | 染陌来源 | ...