将 TinyMCE 集成到 Django 项目中

TinyMCE 是一款基于 Web 的富文本编辑器，它具有极高的灵活性，并支持丰富的自定义功能。它通常用于获取动态数据——比如我们开发的文章内容——因为对于这类内容，通常不使用静态的数据库存储。

安装相关库

要将 TinyMCE 集成到我们的 Django Web 应用或网站中，首先需要安装它的 pip 库。

pip install django-tinymce

与 Django 项目集成

我们需要在 settings.py 中将 TinyMCE 作为一个独立的应用添加进去。

INSTALLED_APPS = [
     ...
    ‘tinymce‘,
     ... 
]

此外，还需要在 settings.py 中添加 TinyMCE 编辑器的默认配置。

TINYMCE_DEFAULT_CONFIG = {
    ‘cleanup_on_startup‘: True,
    ‘custom_undo_redo_levels‘: 20,
    ‘selector‘: ‘textarea‘,
    ‘theme‘: ‘silver‘,
    ‘plugins‘: ‘‘‘
            textcolor save link image media preview codesample contextmenu
            table code lists fullscreen  insertdatetime  nonbreaking
            contextmenu directionality searchreplace wordcount visualblocks
            visualchars code fullscreen autolink lists  charmap print  hr
            anchor pagebreak
            ‘‘‘,
    ‘toolbar1‘: ‘‘‘
            fullscreen preview bold italic underline | fontselect,
            fontsizeselect  | forecolor backcolor | alignleft alignright |
            aligncenter alignjustify | indent outdent | bullist numlist table |
            | link image media | codesample |
            ‘‘‘,
    ‘toolbar2‘: ‘‘‘
            visualblocks visualchars |
            charmap hr pagebreak nonbreaking anchor |  code |
            ‘‘‘,
    ‘contextmenu‘: ‘formats | link image‘,
    ‘menubar‘: True,
    ‘statusbar‘: True,
}

在这个配置字典中，我们可以通过修改主题（theme）等参数的值来自定义编辑器。

TinyMCE 的设置到这里就完成了。为了让它真正运行起来，我们需要创建 forms.py 文件，并设置一些必需的值，例如输入框的大小，这将用于在 HTML 页面上显示内容。

Python3


CODEBLOCK_22c0a617


最后一步是将 HTML 字段添加到我们的模型中。你也可以使用不同的字段类型，可以在它们的官方网站上查看相关文档。

Python3


CODEBLOCK_badcbb4a


现在一切就绪，只需运行以下命令生成迁移文件，即可在管理后台看到变化。

python manage.py makemigrations

python manage.py migrate

现在，通过运行服务器来检查管理后台的效果。

python manage.py runserver

输出效果

下面是它的样子，外观可能会根据配置有所不同。

!html field管理区域中的编辑器