百度编辑器在php中的应用快速入门

本实例采用百度编辑器版本:ueditor1_3_6-utf8-php 版。
下载下来的目录结构如下: 

  • dialogs-----------------各种弹出窗口
  • themes---------------模板文件夹
  • lang--------------- 语言包,
  • php---------------------php后台接口(处理文件、视频、图片、远程图片上传)
  • third-party-------------第三方插件
  • ueditor.all.js------------全局js
  • ueditor.config.js------------供用户配置参数的js
  • ueditor.parse.js--------------编辑器  函数库js


1、编辑器默认把图片、附件等上传到php/upload目录下,这样的结果通常不是我们想要的,大部分web程序都有一个统一的存放附件文件的目录。因此,需要做一些配置,让上传的附件能传到想要的目录下。
2、打开ueditor.config.js ,在定义变量 var URL = window.UEDITOR_HOME_URL || getUEBasePath();
下增加一个 变量,var upfileroot = '';因为有好几个地方要用到这个变量,所以定义成了一个变量,方便以后修改。
3、查找到以下的地方,依次修改:
 ,imagePath:URL + "php/" // 改成
 ,imagePath:upfileroot //URL + "php/"

,scrawlPath:URL+"php/"  //改成
,scrawlPath:upfileroot //URL+"php/" ;

有附件上传的几个地方 都做这样的修改。

4、修改php 文件里的文件
把 上传文件修改到您想要的目录下;
php代码 放到压缩包里,里面还加入图片同步上传到阿里云oss存储空间代码。

5、在页面中加入编辑器

首先在页面头部 加入:

<script type="text/javascript" charset="utf-8">
        //window.UEDITOR_HOME_URL = "/webroot/admin/style1/skin/ueditor/";
		 window.UEDITOR_HOME_URL ="/webroot/public_psp/style1/ueditor/"; 
 
  </script>

<script type='text/javascript' src="ueditor/editor_config.js?p=20140304"></script>	
<script type="text/javascript" src="ueditor/editor_all.js?p=20140304"></script>



在 需要加入编辑器的html 代码中
 <script name="myContent"  id="editor" type="text/plain"><?=$info2[content]?></script>


官方推荐用script标签代替textarea,道理我也没弄清楚。这里无所谓,只要id 正确,用哪种标签都可以;

6、实例化编辑器
     //实例化编辑器
 
    var ue = UE.getEditor('editor');
	
    ue.addListener('ready',function(){
       // this.focus()
    });




你可能感兴趣的:(ueditor)