300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > Django学习18 -- 富文本编辑器(Rich Edit)

Django学习18 -- 富文本编辑器(Rich Edit)

时间:2018-07-19 16:16:03

相关推荐

Django学习18 -- 富文本编辑器(Rich Edit)

1. 富文本编辑器,Rich Edit

CharField,单行文本(Django默认)

TextField,多行文本(Django默认)

富文本编辑器是能显示(编辑)图文效果的输入控件

2. Django支持的富文本编辑器

CKEditor

-即FCKeditor(文本编辑器),一款功能强大的开源在线文本编辑器,所见即所得。基于 JavaScript 开发,在 Web 上实现类似于 Microsoft Word 的强大的功能,不必在客户端安装,兼容各大主流浏览器。参考,

*CKEditor Ecosystem

*收藏 微信 CKEditor 简介

-安装ckeditor:pip install django-ckeditor

-安装js_asset:pip install django-js-asset

-注册 ckeditor

INSTALLED_APPS = [......'ckeditor', # rick edit......]

-配置 Configuration -- All editor features

// This is actually the default value.config.toolbar_Full =[{ name: 'document', items : [ 'Source','-','Save','NewPage','DocProps','Preview','Print','-','Templates' ] },{ name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },{ name: 'editing',items : [ 'Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt' ] },{ name: 'forms', items : [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField' ] },'/',{ name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },{ name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','CreateDiv','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },{ name: 'links', items : [ 'Link','Unlink','Anchor' ] },{ name: 'insert',items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak' ] },'/',{ name: 'styles',items : [ 'Styles','Format','Font','FontSize' ] },{ name: 'colors',items : [ 'TextColor','BGColor' ] },{ name: 'tools', items : [ 'Maximize', 'ShowBlocks','-','About' ] }];

-settings.py设置

## CKEDITOR_CONFIGS = {......}## ...\ckeditor\configs.pyDEFAULT_CONFIG = {"skin": "moono-lisa","toolbar_Basic": [["Source", "-", "Bold", "Italic"]],"toolbar_Full": [["Styles","Format","Bold","Italic","Underline","Strike","SpellChecker","Undo","Redo",],["Link", "Unlink", "Anchor"],["Image", "Flash", "Table", "HorizontalRule"],["TextColor", "BGColor"],["Smiley", "SpecialChar"],["Source"],],"toolbar": "Full","height": 291,"width": 835,"filebrowserWindowWidth": 940,"filebrowserWindowHeight": 725,}

-示例

-参考

*在django中配置富文本编辑器

*CKEditor

*CKEditor 3 JavaScript API Documentation

WangEditor

-国人开发的一款非常优秀的富文本编辑器,开源 Web 富文本编辑器

-安装:pip install django-wangeditor

-注册 wangeditor(INSTALLED_APPS)

INSTALLED_APPS = [......'wangeditor' # rich edit, wangeditor......]from wangeditor.fields import WangRichTextFieldrich_edit_box = WangRichTextField('RichEdit', max_length=1000, )# Error: cannot import name 'force_text' from 'django.utils.encoding'# Solution:settings.py添加import djangofrom django.utils.encoding import force_strdjango.utils.encoding.force_text = force_str

-参考

*wangEditor

-示例

DjangoUeditor -- Python3 / Django 4支持不好,不能正常调试

-百度开源的在线HTML编辑器

-安装:pip install djangoueditor

-编译错误

# from widgets import UEditorWidget,AdminUEditorWidget# ModuleNotFoundError: No module named 'widgets'# 只支持python 2.7, 不支持python 3.X。需要从Git Hub下载最新3版本# DjangoUeditor3 -- /twz915/DjangoUeditor3-- /mirrors/twz915/djangoueditor3?utm_source=csdn_github_accelerator-- /m0_67138207/article/details/125028085

-pip install django-ueditor(什么东东?)

from django.utils.encoding import smart_text# Django 4.0中删除功能,django.utils.encoding.force_text() 和 smart_text() 被移除# INSTALLED_APPS,设置并替换 smart_text -> smart_strimport djangofrom django.utils.encoding import smart_strdjango.utils.encoding.smart_text = smart_str

TinyMCE -- Python3 / Django 4支持不好,不能正常调试

-可视化HTML编辑器。参考,

*GitHub - TinyMCE

*TinyMCE 可视化 HTML 编辑器

-安装:pip install django-tinymce(pip install -i https://pypi.tuna./simple xx)

-注册 tinymce(INSTALLED_APPS)

-ERROR

>> Issue 1: django.core.urlresolvers -> django.urls # from django.core.urlresolvers import reverse# ModuleNotFoundError: No module named 'django.core.urlresolvers'# django2.0 将 django.core.urlresolvers 包 更改为了 django.urls 包# ...\tinymce\views.py##from django.core import urlresolversfrom django import urls# ...\tinymce\widgets.py##from django.core.urlresolvers import reversefrom django.urls import reverse>> Issue 2: flatatt # ...\tinymce\widgets.py##from django.forms.widgets import flatattImportError: cannot import name 'flatatt' from 'django.forms.widgets'>> Issue 3: baseurl # ...\tinymce\settings.py##from utils import baseurlfrom tinymce.utils import baseurl

-参考:

*富文本编辑器 tinymce

*TinyMCE 中文文档

3. 文件参考:

django什么富文本编辑器好用(django富文本编辑器哪个好) - 首席CTO笔记

pip install -i https://pypi.tuna./simple

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。