【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用) python3

【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用)  python3

1:下载编辑器

适配版本:  python3

下载地址:https://github.com/twz915/DjangoUeditor3

2:创建文件夹放入包

创建包extra_apps,将包放入文件夹里,右键点击extra_apps选中菜单mark directory as 选择 sources root 就可以编程蓝色文件夹目录,如图所示,【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用)  python3

3:配置DjangoUeditor3

1:路由配置:打开ulrs.py, 添加路由:url(r'^ueditor/',include('DjangoUeditor.DjangoUeditor.urls'))【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用)  python3

2:配置settings.py:

sys.path.insert(0, os.path.join(BASE_DIR, 'apps'))
sys.path.insert(0, os.path.join(BASE_DIR, 'extra_apps'))

【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用)  python3

'DjangoUeditor.DjangoUeditor',

【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用)  python3

4:创建数据表,注入admin

1:导入编辑器定义的格式:from DjangoUeditor.DjangoUeditor.models import UEditorField

2:创建数据表设置:

class Article(models.Model):
    title = models.CharField(max_length=100, verbose_name='标题')
    content = UEditorField(width=600, height=300, toolbars="full", imagePath="images/", filePath="files/",
                           upload_settings={"imageMaxSize": 1204000}, settings={}, verbose_name='内容')

    class Meta:
        verbose_name = "富文本文章"
        verbose_name_plural = verbose_name
        db_table = 'Article'

3:注入admin:

class ArticleAdmin(admin.ModelAdmin):
    list_display = ('title',)


admin.site.register(models.Article, ArticleAdmin)

5:效果图

 【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用)  python3

 前端渲染:

【Django组件】DjangoUeditor百度富文本编辑器的加载使用(本章admin后台使用)  python3