• django安装DjangoUeditor富文本


    环境:

    pycharm,django1.11,python2.7

    第一种:直接 pip install DjangoUeditor,直接从网上安装到pycharm

    由于是直接安装,ueditor.html,ueditor_old.html会显示无法加载,请到项目下面查到这两个文件,把它拷到 templates 文件夹下面 ,这边是venv/DjangoUeditor emplates下面,大家根据各自的要求进行查看。其它model、urls、settings配置跟第二种一样,请直接看下面

    第二种:

    1.首先,在项目下面随便新建文件夹名ex_blog,

    2.从https://files.pythonhosted.org/packages/92/78/6a97dabce8ab394c78c8ede4bd65a9d740685d65b942641e5859408af102/DjangoUeditor-1.8.143.zip,

    下载安装包,解压包,把最里面的那个文件夹,DjangoUeditor拷到ex_blog下面,

    3.通过pycharm 选中ex_blog文件夹,点击鼠标右键选中菜单 mark directory as 选择 sources root ,就可以变成上面的蓝色文件夹目录,(这一部分重要,用于把整个文件夹提升为项目可直接调用文件,关系到后面程序的调用)

    4.在settings.py的INSTALLED_APPS中引入 DjangoUeditor,并文件中下面添加代码,如下 :

    sys.path.insert(0, os.path.join(BASE_DIR, 'ex_blog')) 

    并在最后添加图片上传路径

    MEDIA_URL = '/static/uepload/'
    MEDIA_ROOT = os.path.join(BASE_DIR, 'static/uepload')

     5.在根的urls.py中添加(注意,并不是app中的urls.py)

    url('^ueditor/', include('DjangoUeditor.urls'))

    6.在models.py中引入UEditorField(注意:models模版中不可以对宽高进行设置)

    from DjangoUeditor.models import UEditorField

    例如:

    class Blogblog(models.Model):
      content=UEditorField(verbose_name='内容')

    7.在admin.py中注册,即可以在admin后台中使用富文本

    from .models import Blogblog

    class Blogblogadmin(admin.ModelAdmin):
      list_display = ['pk','content']

    admin.site.register(Blogblog,Blogblogadmin)

    注意:(第1种和第2种)由于django1.11都会报patterns的错误,请到DjangoUeditor目录下面urls.py中的patterns去除掉,换url,如下:

    #coding:utf-8
    from django import VERSION
    if VERSION[0:2]>(1,3):
    from django.conf.urls import  url
    else:
    from django.conf.urls.defaults import url

    from views import get_ueditor_controller

    urlpatterns = [
    url(r'^controller/$',get_ueditor_controller)
    ]

     

    HTML如何加载富文本

    1.先在views.py中导入模块

    from DjangoUeditor.forms import UEditorField
    from django.forms import forms
    from .models import Blogblog

    2.定义一个forms(设置宽高,以及图片或文件上传的目录,根据上面设置是在uepload目录下面images和files)

    class TestUEditorForm(forms.Form):
    content = UEditorField('内容', width=600, height=300, toolbars="full", imagePath="images/", filePath="files/",upload_settings={"imageMaxSize":1204000},settings={})

    3.把数据库内容渲染到页面

    class Index(View):
    def get(self,request):
    form=TestUEditorForm()
    blogIndex=Blogblog.objects.get(pk=1)
    context=blogIndex.content
    return render(request,'index.html',{'form':form,'context':context})

    4.HTML页面的举例设置

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>Title</title>
    {{ form.media }}    
    </head>
    <body>
    {{ form }}
    </body>
    </html>

    注意:{{ form.media }}    和 {{ form }}  都必须加载,才可以使用富文本

    另外:如果数据库中加载出来的数据是html代码,

    可以使用 {{ context|safe }} 直接转义.

    或者使用

    {% autoescape off %}
    {{ context }}
    {% endautoescape %}

  • 相关阅读:
    JAVA 之 JSTL
    IDEA 之 ERROR:无法在web.xml或使用此应用程序部署的jar文件中解析绝对uri:[http://java.sun.com/jsp/jstl/core]
    JAVA 之 EL表达式
    IDEA 之 ERROR:端口被占用
    【ubuntu】windows+ubuntu 设置windows为第一启动项
    【ubuntu】Error: environment block too small. Press any key to continue
    Navicat premium15安装破解教程
    通过django中间件和python魔法方法实现自定义session(通过文件存储session)
    每日作业 7/2
    每日作业 7/1
  • 原文地址:https://www.cnblogs.com/weilaibuxiangshuo/p/10371931.html
Copyright © 2020-2023  润新知