Django中使用富文本编辑器

最新推荐文章于 2024-04-27 06:00:00 发布

天意不可违.

最新推荐文章于 2024-04-27 06:00:00 发布

阅读量381

点赞数 2

CC 4.0 BY-SA版权

文章标签： django

本文链接：https://blog.youkuaiyun.com/weixin_43670190/article/details/111343031

博客介绍了富文本编辑器django-ckeditor的使用方法，包括安装django-ckeditor包、在项目settings.py中注册、在urls.py中添加路由、修改models.py字段、创建ModelForm、在模板中使用，以及上传文件时取消认证等步骤。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

富文本编辑器django-ckeditor

1.安装django-ckeditor包

pip install django-ckeditor

2.在项目settings.py中注册

INSTALLED_APPS = [
	'ckeditor',
	'ckeditor_uploader'
]

3.在项目的urls.py中添加路由

    url(r'^ckeditor/', include('app01.ckeditor_urls'))

4.将models.py中需要富文本编辑器的字段改为RichTextUploadingField

from ckeditor_uploader.fields import RichTextUploadingField
class ArticleDetail(models.Model):
    """
    文章详情表
    """
    content = RichTextUploadingField(verbose_name='文章详情')

5.创建ModelForm

class ArticleDetailForm(forms.ModelForm):

    class Meta:
        model = models.ArticleDetail
        fields = '__all__'

form_obj = ArticleDetailForm()

6.模板中使用

{{ form_obj.content }}

# 引入静态文件
{% load static %}
    <script type="text/javascript" src="{% static "ckeditor/ckeditor-init.js" %}"></script>
    <script type="text/javascript" src="{% static "ckeditor/ckeditor/ckeditor.js" %}"></script>

7.上传文件需要取消认证

# 找到ckeditor的源码并复制到一个新的ckeditor_urls.py
'''源码路径为
ckeditor_upload
	/urls.py'''
# 将内容中的  staff_member_required 取消掉

# 原内容
urlpatterns = [
    url(r"^upload/", staff_member_required(views.upload), name="ckeditor_upload"),
    url(
        r"^browse/",
        never_cache(staff_member_required(views.browse)),
        name="ckeditor_browse",
    ),
]

# 改为
from __future__ import absolute_import
from django.conf.urls import url
from django.views.decorators.cache import never_cache
from ckeditor_uploader import views

urlpatterns = [
    url(r"^upload/", views.upload, name="ckeditor_upload"),
    url(
        r"^browse/",
        never_cache(views.browse),
        name="ckeditor_browse",
    ),
]


uploader.fields import RichTextUploadingField
class ArticleDetail(models.Model):
    """
    文章详情表
    """
    content = RichTextUploadingField(verbose_name='文章详情')

5.创建ModelForm

class ArticleDetailForm(forms.ModelForm):

    class Meta:
        model = models.ArticleDetail
        fields = '__all__'

form_obj = ArticleDetailForm()

6.模板中使用

{{ form_obj.content }}

# 引入静态文件
{% load static %}
    <script type="text/javascript" src="{% static "ckeditor/ckeditor-init.js" %}"></script>
    <script type="text/javascript" src="{% static "ckeditor/ckeditor/ckeditor.js" %}"></script>

7.上传文件需要取消认证

# 找到ckeditor的源码并复制到一个新的ckeditor_urls.py
'''源码路径为
ckeditor_upload
	urls.py'''
# 将内容中的  staff_member_required 取消掉

# 原内容
urlpatterns = [
    url(r"^upload/", staff_member_required(views.upload), name="ckeditor_upload"),
    url(
        r"^browse/",
        never_cache(staff_member_required(views.browse)),
        name="ckeditor_browse",
    ),
]

# 改为
from __future__ import absolute_import
from django.conf.urls import url
from django.views.decorators.cache import never_cache
from ckeditor_uploader import views

urlpatterns = [
    url(r"^upload/", views.upload, name="ckeditor_upload"),
    url(
        r"^browse/",
        never_cache(views.browse),
        name="ckeditor_browse",
    ),
]