ueditor 不显示工具栏_Python 之Django富文本框Ueditor的使用
Django框架是用Python進行Web開發的重要框架,進行Web開發通常會用到網頁編輯器,百度的Ueditor網頁編輯器功能非常強大,不直接支持python,但有Django第三方插件支持這就是DjangoUeditor編輯器。現把使用方法整理出來供大家開發時參考:
1、下載Ueditor,最后版本:1.4.3.3
UEditor - 下載?ueditor.baidu.com任意下載一個版本,如:PHP版,解壓后,放在Django目錄下。
本項目放在static/plugs/目錄2、安裝DjangoUeditor
在線安裝版本比較舊,不支持Python 3。從GitHub下載支持python3的DjangoUeditor3:
https://github.com/twz915/DjangoUeditor3/?github.com然后離線安裝,執行python setup.py install 安裝。
3、配置DjangoUeditor
(1)、settings.py中的配置
InstallED_APPS中注冊在settings.py 最后添加設置及文件上傳路徑
UEDITOR_SETTINGS = {
"toolbars": { #定義多個工具欄顯示的按鈕,允行定義多個
"name1": [['source', '|', 'bold', 'italic', 'underline']],
"name2": []
},
"images_upload":{
"allow_type":"jpg,png,gif", #定義允許的上傳的圖片類型
"max_size":"10222kb" #定義允許上傳的圖片大小,0代表不限制
},
"files_upload":{
"allow_type":"zip,rar,pdf,docx,doc,xls,xlsx,ppt,pptx,mp4,flv,swf", #定義允許的上傳的文件類型
"max_size":"102222kb" #定義允許上傳的文件大小,0代表不限制
},
"image_manager": {
"location": "" #圖片管理器的位置,如果沒有指定,默認跟圖片路徑上傳一樣
}
}
# DjangoEditor上傳目錄配置
MEDIA_URL='/static/ueupload/'
MEDIA_ROOT='./ExamWeb/static/ueupload/'
(2)、urls.py 中添加路由
url(r'^ueditor/', include('DjangoUeditor.urls'))
4、models.py中引入UEditorField并綁定
from DjangoUeditor.models import UEditorField
把需要使用富文本框的字段類型修改為UEditorField,此類型繼承了TextField5、模板頁面使用
(1)、引入JS腳本
<script src="{% static '/plugs/ueditor/ueditor.config.js'%}"></script>
<script src="{% static '/plugs/ueditor/ueditor.all.min.js'%}"></script>
(2)、綁定富文本框
<script>var ue = UE.getEditor('qcontent',{
'initialFrameWidth':1000,
'initialFrameHeight':150,
'serverUrl': "/ueditor/controller/?imagePathFormat=images/&filePathFormat=files/"
});
</script>
提示:settings.py 中關于上傳路徑的配置一定要注意,曾在這里浪費很多時間,無法正常上傳。注意MEDIA_ROOT的設置,在服務器中目錄的配置會有問題,用BASE_DIR來設置APP目錄,否則在Aapache下上傳目錄會建到C盤或Aapache目錄。
MEDIA_URL='/static/ueupload/'
MEDIA_ROOT=BASE_DIR+'/static/ueupload/'
配置成功界面總結
以上是生活随笔為你收集整理的ueditor 不显示工具栏_Python 之Django富文本框Ueditor的使用的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: tc溜溜865手机投屏卡_下半年发布新品
- 下一篇: python queue模块_Pytho