django项目中使用markdown编辑器和显示

原创 68阅读 · 时间2019年7月30日 18:16

django项目中使用markdown编辑器

当前环境:

python: 3.6.5

django: 1.11


开始配置django编辑器。

1.安装 django-mdeditor。

django-mededitor 是基于 Editor.md 的一个 django Markdown 文本编辑插件应用。

pip install django-]

2. 在项目Setting.py中的IINSTALLED_APPS添加app

IINSTALLED_APPS = [

    ...

    'mdeditor',

]

3. 配置静态资源(图片)上传地址

MEDIA_ROOT = os.path.join(BASE_DIR)
MEDIA_URL =

需要在项目根目录下创建文件夹: uploads/editor/

4. 配置路由

from django.conf.urls urlinclude
from django.contrib admin
from django.conf.urls.static static
from django.conf settings


urlpatterns = [
    url(admin.site.urls)url(include())]

settings.DEBUG:
    urlpatterns += static(settings.MEDIA_URL=settings.MEDIA_ROOT)

5.  创建一个app:

django-admin startapp articles

    在 articles app中的 mmodels.py 中添加 mode:

from django.db models
from mdeditor.fields MDTextField

class Article(models.Model):
    name = models.CharField(==)
    content = MDTextField()


6. 注册到 admin中

   在 articles app中的 admin.py 中 注册应用。

from django.contrib adminarticles.models Article

admin.site.register(Article)

7. 登陆到 admin,尽情创作吧!

image.png


编辑完毕,在前端如何显示呢??

1. 安装 markdown

pip install markdown

2.  在展示详情的页面中引入markdown

import markdown

3. 对 详情做转义处理

from django.shortcuts render
from articles models
import markdown
def index(request):
    article = models.Article.objects.get(pk=2)
    article.content = markdown.markdown(article.content, extensions=[
        'markdown.extensions.extra',
        'markdown.extensions.codehilite',
        'markdown.extensions.toc',
    ])
    return render(request, 'index.html', {'article': article})


4. 在前端 做修改

image.png


最后,一起如你所愿了!



参考: https://blog.csdn.net/duke10/article/details/81033686

https://segmentfault.com/a/1190000013671248#articleHeader5


github地址: https://github.com/pylixm/django-mdeditor


评论

本站升级中... 如有好的建议请加入QQ群!

相关文章推荐 ?
近七日热文推荐 !
回到顶部