码迷,mamicode.com
首页 > 其他好文 > 详细

django xadmin后台集成DjangoUeditor

时间:2018-09-05 21:46:52      阅读:294      评论:0      收藏:0      [点我收藏+]

标签:需要   ssh   下载   hang   技术   graph   paste   图片   esc   

安装和配置xadmin

1. 安装(注意区分版本)

  • python2.x
    pip install xadmin  
  • python3.x
    # 方式1
    pip install git+git://github.com/sshwsfc/xadmin.git
    
    # 方式2
    下载https://codeload.github.com/sshwsfc/xadmin/zip/master,解压并进入目录下,直接python setup.py install
    

2. 配置

1. 将xadmin添加到settings.py应用列表

INSTALLED_APPS = [
        .....  
    # 需要添加以下两个app
    ‘xadmin‘,
    ‘crispy_forms‘,
]

2. 修改项目中urls.py

import xadmin
urlpatterns = [
    # url(r‘^admin/‘, admin.site.urls),
    url(r‘^xadmin/‘, xadmin.site.urls),
]

3. 在models.py中增加模型类

from django.db import models


class Article(models.Model):
    """ 文章表"""
    title = models.CharField(max_length=64, verbose_name=‘标题‘)
    author = models.CharField(max_length=32,verbose_name=‘作者‘, default=‘halo‘)
    content = models.TextField(verbose_name=‘内容‘)
    create_time = models.DateField(auto_now_add=True, editable=True,verbose_name=‘创建时间‘)

    def __str__(self):
        return self.title

    class Meta:
        verbose_name_plural = ‘文章表‘

4. 在应用下新建adminx.py,用来注册模型

import xadmin
from .models import *

class ArticleAdmin(object):
    list_display = (‘title‘, ‘author‘,  ‘create_time‘)

xadmin.site.register(Article, ArticleAdmin)

5. 数据迁移

python manage.py makemigrations
python manage.py migrate

6. 创建用户

python manager.py createsuperuser

7.启动服务并访问

python manage.py runserver 8000

技术分享图片

输入用户名和密码登录成功后如下所示:

技术分享图片

DjangoUeditor安装和配置

1.安装

# python2.x
下载https://codeload.github.com/zhangfisher/DjangoUeditor/zip/master下的源码包,用命令python setup.py install

# python3.x
下载https://codeload.github.com/twz915/DjangoUeditor3/zip/master下的源码包,用命令python setup.py install

2.配置

1. 将DjangoUeditor添加到settings.py应用列表

INSTALLED_APPS = (
          #........
        ‘DjangoUeditor‘,
    )

2.setting.py的其他配置

UEDITOR_SETTINGS={
    "config":{
        "toolbars":[[‘source‘,‘undo‘,‘redo‘,‘bold‘,‘italic‘,‘underline‘,‘forecolor‘,‘backcolor‘,
                     ‘superscript‘,‘subscript‘,‘justifyleft‘,‘justifycenter‘,‘justifyright‘,‘insertorderedlist‘,
                     ‘insertunorderedlist‘,‘blockquote‘,‘formatmatch‘,‘removeformat‘,‘autotypeset‘,‘inserttable‘,
                     ‘pasteplain‘,‘wordimage‘,‘searchreplace‘,‘map‘,‘preview‘,‘fullscreen‘],
                    [‘insertcode‘,‘paragraph‘,‘fontfamily‘,‘fontsize‘,‘link‘,‘unlink‘,‘simpleupload‘,‘insertvideo‘,
                     ‘attachment‘,‘emotion‘,‘date‘,‘time‘]]
    },
}

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.配置adminx.py

import xadmin
from .models import Article


class ArticleAdmin(object):
    list_display = (‘title‘, ‘author‘, ‘tg‘, ‘create_time‘)
    style_fields = {"content": "ueditor"}     # 新增加

xadmin.site.register(Article, ArticleAdmin)

5.配置xadmin:在xadmin/plugins下新建ueditor.py

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 = ‘<script type="text/javascript" src="%s"></script>‘ % (settings.STATIC_URL + "ueditor/ueditor.config.js")  # 自己的静态目录
        js += ‘<script type="text/javascript" src="%s"></script>‘ % (settings.STATIC_URL + "ueditor/ueditor.all.js")  # 自己的静态目录
        nodes.append(js)

xadmin.site.register_plugin(UeditorPlugin, UpdateAdminView)
xadmin.site.register_plugin(UeditorPlugin, CreateAdminView)

6.在xadmin/plugins/__init__.py添加ueditor

‘ueditor‘

7.在models下添加ueditor项

from DjangoUeditor.models import UEditorField

class Article(models.Model):
    """ 文章表"""
    title = models.CharField(max_length=64, verbose_name=‘标题‘)
    author = models.CharField(max_length=32,verbose_name=‘作者‘, default=‘halo‘)
    # content = models.TextField(verbose_name=‘内容‘)
    content = UEditorField(verbose_name=‘内容‘,
                           height=500,
                           width=800,
                           default=u‘‘,
                           imagePath="ueditor/image/",
                           toolbars=‘full‘,
                           filePath=‘ueditor/files/‘,
                           upload_settings={"imageMaxSize": 1204000},
                           settings={},
                           command=None, )
    create_time = models.DateField(auto_now_add=True, editable=True,verbose_name=‘创建时间‘)

    def __str__(self):
        return self.title

    class Meta:
        verbose_name_plural = ‘文章表‘

8.页面中显示富文本

{% autoescape off %}
{{ item.content }}
{% endautoescape %}

  

 

django xadmin后台集成DjangoUeditor

标签:需要   ssh   下载   hang   技术   graph   paste   图片   esc   

原文地址:https://www.cnblogs.com/yzls/p/9593939.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!