首页 » Web技术 » HTML/CSS » 正文

kindeditor编辑器优化图片上传目录修改

一、传取消网络图片

1.单图片上传图片(非编辑器),传取消网络图片。调用的js中,在editor.plugin.imageDialog({   });中增加showRemote : false,

2.单图片上传图片(编辑器),传取消网络图片。修改editor\plugins\image\image.js,在self.plugin.imageDialog({   });中增加showRemote : false,

二、批量上传图片,图片大小与图片数量修改

1.修改editor\plugins\multiimage\multiimage.js,KindEditor.plugin(‘multiimage’, function(K) {}中imageSizeLimit = K.undef(self.imageSizeLimit, ’40MB’),imageUploadLimit = K.undef(self.imageUploadLimit, 1000),表示同时可上传1000张,每张大小40M以内。

2.upload_json.php中的$max_size可能需要修改,php.ini可能也需要修改上传大小。

三、上传文件目录修改

1.upload_json.php中,$save_path = $php_path . ‘/uploadpic/’; 上传文件的地址(保存数据),$save_url = ‘/uploadpic/’;  上传文件大小限制,$max_size = 3 * 1024 * 1024;   表示3M。对上传文件重新命名,$new_file_name = date(“YmdHis”) . rand(10, 99) . ‘.’ . $file_ext;

四、上传的图片全部使用<p></p>隔开,取消自动生成的<p><br/></p>

1.kindeditor.js中,找到insertimage : function,修改<img>标签,在外面加<p>。这样无论怎么上传图片,每张图片都会由一个<p></p>,而且不会存在首行缩进的问题,但是会出现多余的代码(<p><br/></p>),增加了多余的行。

2.kindeditor.js中,找到html = html.replace(/(<(?:p|p\s[^>]*)>)\s*(<\/p>)/ig, ‘$1<br />$2’);,修改为html = html.replace(/(<(?:p|p\s[^>]*)>)\s*(<\/p>)/ig, ‘$1$2’);。这样做取消了多余的空行。

3.clearhtml.js中,添加html = html.replace(/<img/ig, ‘<p><img’);html = html.replace(/<p><\/p>/ig, ”);,格式化时所有图片加<p></p>,最后消除多余的<p></p>。

五、操作显示优化,图片显示缩小,段落间距增大,光标显示清晰

1.kindeditor.js中,找到function _getInitHtml,添加style,’p img{max-width:620px;}’,(使图片缩小)。修改’img {border:0;}’,,变为’img {border:0;padding:0 5px;}’,(光标显示清晰),修改’p {margin:5px 0px;}’,,变为’p {margin:10px 0px;}’,(段落间距增大)。

发表评论