readme.txt 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170
  1. 本模块帮助在Django应用中集成百度Ueditor HTML编辑器,Ueditor HTML编辑器是百度开源的HTML编辑器,
  2. *2014-5-15*
  3. --增加不过滤 script,style ,不自动转div为p的脚本
  4. --修复在django 1.6和python2.7下的警告
  5. --使用 json 代替 django 中的 simplejson
  6. --用content_type 代替原来的 mime_type
  7. *2014-5-7*
  8. --更新到Ueditor 1.3.6
  9. --BUGfix:更新UEditor文件夹名字,避免在linux出现找不到静态文件问题
  10. --添加一种样式,besttome, 希望大家喜欢
  11. *2013-2-22*
  12. --更新到Ueditor 1.2.5
  13. --BUGfix:更新UEditor文件夹名字,避免在linux出现找不到静态文件问题
  14. --BUGfix:现在支持south更新了
  15. --针对csrf导致上传图片失败的问题,现在默认上传视图开启了csrf_exempt装饰
  16. 使用Django-Ueditor非常简单,方法如下:
  17. #1、安装方法
  18. ============================
  19. **方法一:下载安装包,在命令行运行:
  20. python setup.py install
  21. **方法二:使用pip工具在命令行运行(推荐):
  22. pip install DjangoUeditor
  23. 2、在INSTALL_APPS里面增加DjangoUeditor app,如下:
  24. ============================
  25. INSTALLED_APPS = (
  26. #........
  27. 'DjangoUeditor',
  28. )
  29. 3、在urls.py中增加:
  30. ============================
  31. url(r'^ueditor/',include('DjangoUeditor.urls' )),
  32. 4、在models中这样定义:
  33. ============================
  34. from DjangoUeditor.models import UEditorField
  35. class Blog(models.Model):
  36. Name=models.CharField(,max_length=100,blank=True)
  37. Content=UEditorField(u'内容 ',height=100,width=500,default='test',imagePath="uploadimg/",imageManagerPath="imglib",toolbars='mini',options={"elementPathEnabled":True},filePath='upload',blank=True)
  38. 说明:
  39. UEditorField继承自models.TextField,因此你可以直接将model里面定义的models.TextField直接改成UEditorField即可。
  40. UEditorField提供了额外的参数:
  41. toolbars:配置你想显示的工具栏,取值为mini,normal,full,代表小,一般,全部。如果默认的工具栏不符合您的要求,您可以在settings里面配置自己的显示按钮。参见后面介绍。
  42. imagePath:图片上传的路径,如"images/",实现上传到"{{MEDIA_ROOT}}/images"文件夹
  43. filePath:附件上传的路径,如"files/",实现上传到"{{MEDIA_ROOT}}/files"文件夹
  44. scrawlPath:涂鸦文件上传的路径,如"scrawls/",实现上传到"{{MEDIA_ROOT}}/scrawls"文件夹,如果不指定则默认=imagepath
  45. imageManagerPath:图片管理器显示的路径,如"imglib/",实现上传到"{{MEDIA_ROOT}}/imglib",如果不指定则默认=imagepath。
  46. options:其他UEditor参数,字典类型。参见Ueditor的文档ueditor_config.js里面的说明。
  47. css:编辑器textarea的CSS样式
  48. width,height:编辑器的宽度和高度,以像素为单位。
  49. 5、在表单中使用非常简单,与常规的form字段没什么差别,如下:
  50. ============================
  51. class TestUeditorModelForm(forms.ModelForm):
  52. class Meta:
  53. model=Blog
  54. ***********************************
  55. 如果不是用ModelForm,可以有两种方法使用:
  56. 1: 使用forms.UEditorField
  57. from DjangoUeditor.forms import UEditorField
  58. class TestUEditorForm(forms.Form):
  59. Description=UEditorField("描述",initial="abc",width=600,height=800)
  60. 2: widgets.UEditorWidget
  61. from DjangoUeditor.widgets import UEditorWidget
  62. class TestUEditorForm(forms.Form):
  63. Content=forms.CharField(label="内容",widget=UEditorWidget(width=800,height=500, imagePath='aa', filePath='bb',toolbars={}))
  64. widgets.UEditorWidget和forms.UEditorField的输入参数与上述models.UEditorField一样。
  65. 6、Settings配置
  66. ============================
  67. 在Django的Settings可以配置以下参数:
  68. UEDITOR_SETTINGS={
  69. "toolbars":{ #定义多个工具栏显示的按钮,允行定义多个
  70. "name1":[[ 'source', '|','bold', 'italic', 'underline']],
  71. "name2",[]
  72. },
  73. "images_upload":{
  74. "allow_type":"jpg,png", #定义允许的上传的图片类型
  75. "path":"", #定义默认的上传路径
  76. "max_size":"2222kb" #定义允许上传的图片大小,0代表不限制
  77. },
  78. "files_upload":{
  79. "allow_type":"zip,rar", #定义允许的上传的文件类型
  80. "path":"" #定义默认的上传路径
  81. "max_size":"2222kb" #定义允许上传的文件大小,0代表不限制
  82. },,
  83. "image_manager":{
  84. "path":"" #图片管理器的位置,如果没有指定,默认跟图片路径上传一样
  85. },
  86. "scrawl_upload":{
  87. "path":"" #涂鸦图片默认的上传路径
  88. }
  89. }
  90. 7、在模板里面:
  91. ============================
  92. <head>
  93. ......
  94. {{ form.media }} #这一句会将所需要的CSS和JS加进来。
  95. ......
  96. </head>
  97. 注:运行collectstatic命令,将所依赖的css,js之类的文件复制到{{STATIC_ROOT}}文件夹里面。
  98. 8、高级运用:
  99. ============================
  100. ****************
  101. 动态指定imagePath、filePath、scrawlPath、imageManagerPath
  102. ****************
  103. 这几个路径文件用于保存上传的图片或附件,您可以直接指定路径,如:
  104. UEditorField('内容',imagePath="uploadimg/")
  105. 则图片会被上传到"{{MEDIA_ROOT}}/uploadimg"文件夹,也可以指定为一个函数,如:
  106. def getImagePath(model_instance=None):
  107. return "abc/"
  108. UEditorField('内容',imagePath=getImagePath)
  109. 则图片会被上传到"{{MEDIA_ROOT}}/abc"文件夹。
  110. ****************
  111. 使上传路径(imagePath、filePath、scrawlPath、imageManagerPath)与Model实例字段值相关
  112. ****************
  113. 在有些情况下,我们可能想让上传的文件路径是由当前Model实例字值组名而成,比如:
  114. class Blog(Models.Model):
  115. Name=models.CharField('姓名',max_length=100,blank=True)
  116. Description=UEditorField('描述',blank=True,imagePath=getUploadPath,toolbars="full")
  117. id | Name | Description
  118. ------------------------------------
  119. 1 | Tom | ...........
  120. 2 | Jack | ...........
  121. 我们想让第一条记录上传的图片或附件上传到"{{MEDIA_ROOT}}/Tom"文件夹,第2条记录则上传到"{{MEDIA_ROOT}}/Jack"文件夹。
  122. 该怎么做呢,很简单。
  123. def getUploadPath(model_instance=None):
  124. return "%s/" % model_instance.Name
  125. 在Model里面这样定义:
  126. Description=UEditorField('描述',blank=True,imagePath=getUploadPath,toolbars="full")
  127. 这上面model_instance就是当前model的实例对象。
  128. 还需要这样定义表单对象:
  129. from DjangoUeditor.forms import UEditorModelForm
  130. class UEditorTestModelForm(UEditorModelForm):
  131. class Meta:
  132. model=Blog
  133. 特别注意:
  134. **表单对象必须是继承自UEditorModelForm,否则您会发现model_instance总会是None。
  135. **同时在Admin管理界面中,此特性无效,model_instance总会是None。
  136. **在新建表单中,model_instance由于还没有保存到数据库,所以如果访问model_instance.pk可能是空的。因为您需要在getUploadPath处理这种情况
  137. 8、其他事项:
  138. ============================
  139. **本程序版本号采用a.b.ccc,其中a.b是本程序的号,ccc是ueditor的版本号,如1.2.122,1.2是DjangoUeditor的版本号,122指Ueditor 1.2.2.
  140. **本程序安装包里面已经包括了Ueditor,不需要再额外安装。
  141. **目前暂时不支持ueditor的插件
  142. **别忘记了运行collectstatic命令,该命令可以将ueditor的所有文件复制到{{STATIC_ROOT}}文件夹里面
  143. **Django默认开启了CSRF中间件,因此如果你的表单没有加入{% csrf_token %},那么当您上传文件和图片时会失败