技术源于努力
努力实现梦想

wordpress添加KindEditor 实现粘贴上传图片

 wordpress的经典编辑器不能粘贴图片,所以找到这个插件进行更改

1、先安装经典编辑器Classic Editor和KindEditor 插件

2、修改对应的kindeditor代码,/wp-content/plugins/kindeditor-for-wordpress/kindeditor_class.php 47行后添加:

afterCreate:function(){
       var doc   = this.edit.doc; 
       var cmd = this.edit.cmd;
       $(doc.body).bind('paste',function(ev){
              var $this    = $(this);
              var dataItem =  ev.originalEvent.clipboardData.items[0];
              if(dataItem){
                    var file     = dataItem.getAsFile();
                    if(file){
                        var reader = new FileReader();
                        reader.onload = function(evt)  {
                        var imageDataBase64 = evt.target.result;
                        $.post(options.uploadJson+"?imageData=Base64",{"imageDataBase64":imageDataBase64},function(resp){
                            var respData = JSON.parse(resp);
                            if(respData.error == 0){
                                 var html = '<img src="' + respData.url + '" alt="" />';
                                 cmd.inserthtml(html);
                                      }
                                  });
                                };
                        reader.readAsDataURL(file);
                        } 
                        }
                   });                       
        }

3、修改php/upload_json.php,在23行增加:

if (isset($_GET["imageData"]) && $_GET["imageData"]=="Base64"){
        $content = $_POST["imageDataBase64"];
        //创建文件夹
        if ( ! is_dir($save_path . date('Y'))) {
                mkdir($save_path . date('Y'));
                mkdir($save_path . date('Y') . '/' . date('m'));
        } else {
                if ( ! is_dir($save_path . date('Y') . '/' . date('m')))
                        mkdir($save_path . date('Y') . '/' . date('m'));
        }
        $save_path .= date('Y') . '/' . date('m') . '/';
        $save_url .= date('Y') . '/' . date('m') . '/';
        if(preg_match('/^(data:s*image/(w+);base64,)/', $content, $result)){
                $type = $result[2];
                $new_file_name = date("YmdHis") . '_' . rand(10000, 99999) .".".$type;
                $file_path = $save_path . $new_file_name;
                if(in_array($type,array('pjpeg','jpeg','jpg','gif','bmp','png'))){
                        if(file_put_contents($file_path, base64_decode(str_replace($result[1], '', $content)))){
                                        @chmod($file_path, 0644);
                                        $file_url = $save_url . $new_file_name;
                                        header('Content-type: text/html; charset=UTF-8');
                                        $json = new Services_JSON();
                                        echo $json->encode(array('error' => 0, 'url' => $file_url));
                                        exit;
                                }else{
                                alert("上传文件失败。");
                                }
            }else{
                //文件类型错误
                        alert("上传文件扩展名是不允许的扩展名");
                }

        }else{
          //文件错误
          alert("文件错误");
        }
}

4、刷新编辑器,截图测试

赞(0) 感谢小主打赏
未经允许不得转载:新域软件科技 » wordpress添加KindEditor 实现粘贴上传图片
分享到: 更多 (0)

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏