這篇文章將為大家詳細講解有關(guān)django xadmin如何集成DjangoUeditor富文本編輯器，小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。
Ueditor HTML編輯器是百度開源的在線HTML編輯器,功能非常強大
解決圖片視頻等無法上傳顯示問題
解壓后將 DjangoUeditor 文件夾復(fù)制到django項目目錄下，跟app目錄同級
導(dǎo)入UEditorField 模塊
增加需要富文本框的字段
重慶分公司
重慶分公司
from DjangoUeditor.models import UEditorField
class Post(models.Model):
"""文章"""
STATUS_CHOICES = (
('draft','草稿'),
('published','已發(fā)布'),
)
...
body = UEditorField('內(nèi)容', height=300, width=800,max_length=1024000000000,
default=u'', blank=True, imagePath="images/",
toolbars='besttome', filePath='files/')
...說明：
UEditorField繼承自models.TextField,因此你可以直接將model里面定義的models.TextField直接改成UEditorField即可。
UEditorField提供了額外的參數(shù)：
toolbars:配置你想顯示的工具欄，取值為mini,normal,full,besttome, 代表小，一般，全部,涂偉忠貢獻的一種樣式。如果默認的工具欄不符合您的要求，您可以在settings里面配置自己的顯示按鈕。參見后面介紹。
imagePath:圖片上傳的路徑,如"images/",實現(xiàn)上傳到"{{MEDIA_ROOT}}/images"文件夾
filePath:附件上傳的路徑,如"files/",實現(xiàn)上傳到"{{MEDIA_ROOT}}/files"文件夾
scrawlPath:涂鴉文件上傳的路徑,如"scrawls/",實現(xiàn)上傳到"{{MEDIA_ROOT}}/scrawls"文件夾,如果不指定則默認=imagepath
imageManagerPath:圖片管理器顯示的路徑，如"imglib/",實現(xiàn)上傳到"{{MEDIA_ROOT}}/imglib",如果不指定則默認=imagepath。
options：其他UEditor參數(shù)，字典類型。參見Ueditor的文檔ueditor_config.js里面的說明。
css:編輯器textarea的CSS樣式
width，height:編輯器的寬度和高度，以像素為單位。
初始化數(shù)據(jù)庫
makemigrations migrate
增加文件上傳路徑配置
MEDIA_URL='/upload/' MEDIA_ROOT = os.path.join(BASE_DIR, 'upload/')#這個是在瀏覽器上訪問該上傳文件的url的前綴
在項目下的xadmin\plugins\路徑下新建ueditor.py腳本,內(nèi)容如下
import xadmin
from xadmin.views import BaseAdminPlugin, CreateAdminView, ModelFormAdminView, UpdateAdminView
from DjangoUeditor.models import UEditorField
from DjangoUeditor.widgets import UEditorWidget
from django.conf import settings
class XadminUEditorWidget(UEditorWidget):
def __init__(self,**kwargs):
self.ueditor_options=kwargs
self.Media.js = None
super(XadminUEditorWidget,self).__init__(kwargs)
class UeditorPlugin(BaseAdminPlugin):
def get_field_style(self, attrs, db_field, style, **kwargs):
if style == 'ueditor':
if isinstance(db_field, UEditorField):
widget = db_field.formfield().widget
param = {}
param.update(widget.ueditor_settings)
param.update(widget.attrs)
return {'widget': XadminUEditorWidget(**param)}
return attrs
def block_extrahead(self, context, nodes):
js = '' % (settings.STATIC_URL + "ueditor/ueditor.config.js") # 自己的靜態(tài)目錄
js += '' % (settings.STATIC_URL + "ueditor/ueditor.all.js") # 自己的靜態(tài)目錄
nodes.append(js)
xadmin.site.register_plugin(UeditorPlugin, UpdateAdminView)
xadmin.site.register_plugin(UeditorPlugin, CreateAdminView) 在xadmin\plugins\路徑下的init.py文件下的PLUGINS項添加ueditor，如下最后一行為新增的
E:\items\blog_project\xadmin\plugins\__init__.py PLUGINS = ( 'actions', 'filters', 'bookmark', 'export', 'layout', 'refresh', 'details', 'editable', 'relate', 'chart', 'ajax', 'relfield', 'inline', 'topnav', 'portal', 'quickform', 'wizard', 'images', 'auth', 'multiselect', 'themes', 'aggregation', 'mobile', 'passwords', 'sitemenu', 'language', 'quickfilter', 'sortablelist', 'importexport', 'ueditor', )
在項目下的static目錄下新建ueditor目錄
把DjangoUeditor目錄下的ueditor目錄下的js文件移動到項目的static目錄下的ueditor里
以下為新增項
from django.conf.urls import url,include
...
import xadmin
import DjangoUeditor
urlpatterns = [
url(r'^xadmin/', xadmin.site.urls),
...
url(r'^ueditor/', include('DjangoUeditor.urls'))
]
from django.conf import settings
if settings.DEBUG:
from django.conf.urls.static import static
urlpatterns += static(
settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)關(guān)于“django xadmin如何集成DjangoUeditor富文本編輯器”這篇文章就分享到這里了，希望以上內(nèi)容可以對大家有一定的幫助，使各位可以學(xué)到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
創(chuàng)新互聯(lián)www.cdcxhl.cn，專業(yè)提供香港、美國云服務(wù)器，動態(tài)BGP最優(yōu)骨干路由自動選擇，持續(xù)穩(wěn)定高效的網(wǎng)絡(luò)助力業(yè)務(wù)部署。公司持有工信部辦法的idc、isp許可證， 機房獨有T級流量清洗系統(tǒng)配攻擊溯源，準(zhǔn)確進行流量調(diào)度，確保服務(wù)器高可用性。佳節(jié)活動現(xiàn)已開啟，新人活動云服務(wù)器買多久送多久。
