1.DjangoUeditor的安裝與配置
pip install DjangoUeditor -i https://pypi.doubanio.com/simple
(python38_imooc) C:\python_practice\wleducation>pip install DjangoUeditor -i https://pypi.doubanio.com/simple
Looking in indexes: https://pypi.doubanio.com/simple
Collecting DjangoUeditor
? Using cached DjangoUeditor-1.8.143-py3-none-any.whl
Installing collected packages: DjangoUeditor
Successfully installed DjangoUeditor-1.8.143
運(yùn)行有問題:
? File "C:\python_envs\python38_imooc\lib\site-packages\DjangoUeditor\models.py", line 4, in <module>
? ? from widgets import UEditorWidget,AdminUEditorWidget
ModuleNotFoundError: No module named 'widgets'
采用網(wǎng)上修改好的版本DjangoUeditor3
git clone git@github.com:twz915/DjangoUeditor3.git
1). settings.py
sys.path.insert(0, os.path.join(BASE_DIR, 'extra_apps')) # 把extra_apps文件夾添加到搜索目錄中
卸載上面安裝的 DjangoUeditor
2) pip unstall? DjangoUeditor
3) 復(fù)制 clode git 上面的 DjangoUeditor? 到? extra_apps? 目錄下面
4) 需要修改 里面的six 等不匹配的python
vires.py
# from django.utils.six.moves.urllib.request import urlopen
# from django.utils.six.moves.urllib.parse import urljoin
from urllib.request import urlopen as urlopen
from six.moves.urllib.parse import urljoin
commands.py
# from django.utils.six.moves.urllib.parse import urljoin
from urllib.parse import urljoin
2. 在INSTALL_APPS里面增加如下配置:
INSTALLED_APPS = (
? # 添加 ueditor 富文本編輯器
'DjangoUeditor',
)
3赴肚、在setting.py的其他配置
UEDITOR_SETTINGS = {
? ? ? ? ? ? ? ? ? ? ? "toolbars": {? # 定義多個(gè)工具欄顯示的按鈕锄蹂,允行定義多個(gè)
? ? ? ? ? ? ? ? ? ? ? ? ? "name1": [['source', '|', 'bold', 'italic', 'underline']],
? ? ? ? ? ? ? ? ? ? ? ? ? "name2": []
? ? ? ? ? ? ? ? ? },
? ? ? ? ? ? ? ? ? "images_upload":{
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? "allow_type": "jpg,png",? # 定義允許的上傳的圖片類型
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? "max_size": "2222kb"? # 定義允許上傳的圖片大小罚缕,0代表不限制
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? },
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? "files_upload": {
? ? "allow_type": "zip,rar",? # 定義允許的上傳的文件類型
? ? "max_size": "2222kb"? # 定義允許上傳的文件大小,0代表不限制
},
"image_manager": {
? ? "location": ""? # 圖片管理器的位置,如果沒有指定帮哈,默認(rèn)跟圖片路徑上傳一樣
},
}
MEDIA_URL='/upload/'
MEDIA_ROOT = os.path.join(BASE_DIR, 'upload/')#這個(gè)是在瀏覽器上訪問該上傳文件的url的前綴
說明:
UEditorField繼承自models.TextField,因此你可以直接將model里面定義的models.TextField直接改成UEditorField即可。
UEditorField提供了額外的參數(shù):
? ? toolbars:配置你想顯示的工具欄,取值為mini,normal,full,besttome, 代表小愉择,一般匪凡,全部,涂偉忠貢獻(xiàn)的一種樣式膊畴。如果默認(rèn)的工具欄不符合您的要求,您可以在settings里面配置自己的顯示按鈕病游。參見后面介紹唇跨。
? ? imagePath:圖片上傳的路徑,如"images/",實(shí)現(xiàn)上傳到"{{MEDIA_ROOT}}/images"文件夾
? ? filePath:附件上傳的路徑,如"files/",實(shí)現(xiàn)上傳到"{{MEDIA_ROOT}}/files"文件夾
? ? scrawlPath:涂鴉文件上傳的路徑,如"scrawls/",實(shí)現(xiàn)上傳到"{{MEDIA_ROOT}}/scrawls"文件夾,如果不指定則默認(rèn)=imagepath
? ? imageManagerPath:圖片管理器顯示的路徑,如"imglib/",實(shí)現(xiàn)上傳到"{{MEDIA_ROOT}}/imglib",如果不指定則默認(rèn)=imagepath衬衬。
? ? options:其他UEditor參數(shù)买猖,字典類型。參見Ueditor的文檔ueditor_config.js里面的說明滋尉。
? ? css:編輯器textarea的CSS樣式
? ? width玉控,height:編輯器的寬度和高度,以像素為單位狮惜。
3高诺、配置url
from django.conf.urls.static import static
from django.conf import settings
? ? url(r'^ueditor/', include('DjangoUeditor.urls')),
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
4.配置 models.py
class Question(models.Model):
? ? # 富文本 我試過很多其他的富文本
? ? # content = HTMLField(verbose_name='內(nèi)容')
? ? # content = MarkdownField(verbose_name='內(nèi)容')
? ? # content = models.TextField(verbose_name='內(nèi)容')
? ? #ckeditor.fields.RichTextField 不支持上傳文件的富文本字段
? ? #
? ? question_context = UEditorField(verbose_name='內(nèi)容', height=500, width=1000,
? ? ? ? ? ? ? ? ? ? ? ? ? default=u'', imagePath="media/%%Y/%%m/",
? ? ? ? ? ? ? ? ? ? ? ? ? toolbars='full', filePath='%%Y/%%m/',
? ? ? ? ? ? ? ? ? ? ? ? ? upload_settings={"imageMaxSize": 1204000},
? ? ? ? ? ? ? ? ? ? ? ? ? settings={}, command=None, )
5. 配置 admin.py
class QuestionAdminForm(forms.ModelForm):
? ? class Meta:
? ? ? ? model = Question
? ? ? ? fields = "__all__"
class QuestionAdmin(admin.ModelAdmin):
? ? form = QuestionAdminForm
admin.site.register(Question, QuestionAdmin)
6. 測試運(yùn)行:
測試沒有問題,感覺頁面插件更改豐富一些碾篡。