最近在搞phpcms视频功能,官方的视频功能实在是坑,刚开始是想将优酷的上传功能集成到ckeditor,在coding上有个项目,上传已经集成好了,还没有做上传后视频的获取和显示

项目地址:https://coding.net/savokiss/melos.git

这个项目是可以在线演示的,有兴趣的同学可以私信我或者fork一下

今天偶然看到了百度的ueditor,看了一下有视频上传功能,可以满足小规模视频需求,所以就开始搞了,

网上看了很多教程有个别的缺点,不太适用于最新版v9,所以自己整理了一下:修改前注意备份

1. 下载Ueditor

官网:http://ueditor.baidu.com/website/download.html

2.解压到phpcms目录

将压缩包内文件夹改名为ueditor解压到phpcms目录下面的./statics/js/下,目录结构如下:

3.修改ueditor/php/config.json

全局替换,

- 如果是本地项目,将/ueditor/php/upload/替换为/网站文件夹/uploadfile/

- 如果是线上项目,将/ueditor/php/upload/替换为/uploadfile/

4.修改./libs/classes/form.class.php文件

将静态方法editor里面所有内容替换为:

$str ='';
if(!defined('EDITOR_INIT')) {
$str .= '<script type="text/javascript" src="'.JS_PATH.'ueditor/ueditor.config.js"></script>';
$str .= '<script type="text/javascript" src="'.JS_PATH.'ueditor/ueditor.all.js"></script>';
$str .= '<script type="text/javascript" src="'.JS_PATH.'ueditor/ueditor.parse.js"></script>';
$str .= '<link rel="stylesheet" href="'.JS_PATH.'ueditor/themes/default/css/ueditor.css"/>';
define('EDITOR_INIT', 1);
}
$str .= "<script type=\"text/javascript\">\r\n";
$str .= "var editor = UE.getEditor('$textareaid');";
$str .= '</script>';
return $str;

5.修改ueditor大小

在ueditor/themes/default/css/ueditor.css中,

找到/*UI工具栏、编辑区域、底部*/下面的css:.edui-default .edui-editor,在其中添加:

width:auto!important;//用于ueditor工具栏的宽度自适应

往下找到edui-editor-iframeholder,在其中也添加:

width:auto!important;//用于ueditor内容框宽度自适应

6.修改ueditor宽度

ueditor/ueditor.config.js中,

找到initialFrameHeight,将此行注释取消掉(默认的高度比较低)

注意:

1.如果需要自定义工具栏:

修改ueditor/ueditor.config.js配置文件,

,toorbars : [[ ********** ]]

这个工具栏图标你可以参照官方文档进行修改,去掉不需要的功能:http://fex.baidu.com/ueditor/#start-toolbar

2.附件没有按照phpcms的命名规则修改,

如果需要修改,在config.json文件中:

按如下替换:注意涉及到image,file,video,需要替换三次

uploadfile/{yyyy}/{mm}{dd}/{yyyy}{mm}{dd}{rand:6}

3.phpcms自带的ckeditor是上传附件的时候是操作数据库的

所以后台附件管理有数据库模式,而咱没有写相关代码,所以如果需要管理附件只能用目录模式进行删除,这种情况下也就不需要注意路径问题了

4.本方法是在新安装的phpcms v9.5.8上面完成的,所以没有考虑已有附件在ueditor中的显示问题

如果是已存在的附件,需要替换如下图三个文件中的一些路径:

具体可以参考下帖对这三个文件的操作部分:http://bbs.phpcms.cn/thread-882637-1-1.html

5.关于上传的视频在IE下看不到的问题(2014.11.6更新)

参考这篇文章:http://blog.csdn.net/estelle_belle/article/details/40047443

在视频播放的页面或者header引入如下代码即可

<!--[if IE]>
<script src="http://api.html5media.info/1.1.4/html5media.min.js"></script>
<![endif]-->

上述方法改过之后暂时没有发现问题,如果有问题随时更新,欢迎交流!

phpcmsV9.5.8整合百度编辑器Ueditor1.4.3教程的更多相关文章

  1. yii2整合百度编辑器umeditor

    作者:白狼 出处:www.manks.top/article/yii2_umeditor 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责 ...

  2. 帝国cms7.0整合百度编辑器ueditor教程

    帝国cms7.0整合百度编辑器ueditor教程开始 1.根据自己使用的帝国cms版本编码下载对应的ueditor版本 下载地址 http://ueditor.baidu.com/website/do ...

  3. 帝国cms7.5整合百度编辑器ueditor教程

    1.根据自己使用的帝国cms版本编码下载对应的ueditor版本 下载地址 http://ueditor.baidu.com/website/download.html#ueditor 2.解压附件, ...

  4. 百度编辑器ueditor1.4.3配置记录

    我从官网下载的php文件,但是图片上传不能用,后来查找资料,打开ueditor下的php/controller.php,(其他环境选对应的文件夹)把时区设置按如下改个字母大小写,再打开该文件就正确返回 ...

  5. yii2解决百度编辑器umeditor图片上传问题

    作者:白狼 出处:http://www.manks.top/article/yii2_umeditor_upload本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原 ...

  6. ThinkPHP3.1.3 整合 UEditor百度编辑器 图片上传

    第一步.前端模板实例化百度编辑器 <js file='__ROOT__/Data/UEditor/ueditor.config.js' /> <js file='__ROOT__/D ...

  7. Javascript - ExtJs - 整合百度文章编辑器

    ExtJs - 整合百度文章编辑器(ExtJs UEditor) 第一步:去官网下载最新版本的UEditor,UEditor下载. 第二步:在编辑器根目录创建一个Extjs-Editor.js,录入以 ...

  8. DEDECMS:DEDE整合(UEditor)百度编辑器以后,栏目内容、单页无法保存内容的bug处理方法

    已经整合过百度编辑器的站长们或许会发现,在编辑单页文档和栏目内容的时候,百度编辑器不能够保存新增或已修改数据,经过排查后发现问题出现在catalog_edit.htm.catalog_add.htm这 ...

  9. springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑)

    springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑) 写在前面: ​ 富文本编辑器,Multi-function Text Editor, 简称 MTE, 是一 ...

随机推荐

  1. nginx和fpm的进程数配置和502,504错误

    502 和 php-fpm.conf 1.php-cgi进程数不够用.php执行时间长,导致没有空闲进程处理新请求. 2.php-cgi进程死掉.php-fpm超时时间短,当前进程执行超时关闭连接. ...

  2. php self与static的区别

    self vs static 用一个demo来直接说明self与static的区别.self示例: <?phpclass Vehicle {    protected static $name ...

  3. 缓存 HttpContext.Current.Cache和HttpRuntime.Cache的区别

    先看MSDN上的解释: HttpContext.Current.Cache:为当前 HTTP 请求获取Cache对象. HttpRuntime.Cache:获取当前应用程序的Cache.  我们再用. ...

  4. Spring系列之beanFactory与ApplicationContext

    一.BeanFactoryBeanFactory 是 Spring 的“心脏”.它就是 Spring IoC 容器的真面目.Spring 使用 BeanFactory 来实例化.配置和管理 Bean. ...

  5. 并发下常见的加锁及锁的PHP具体实现代码(转)

    在最近的项目中有这样的场景 1.生成文件的时候,由于多用户都有权限进行生成,防止并发下,导致生成的结果出现错误,需要对生成的过程进行加锁,只容许一个用户在一个时间内进行操作,这个时候就需要用到锁了,将 ...

  6. Struts2 自定义拦截器

    自定义拦截器(权限管理),包含了对ajax和表单请求的拦截 package com.interceptor; import java.io.IOException; import java.io.Pr ...

  7. 导航菜单:jQuery粘性滚动导航栏效果

    粘性滚动是当导航在滚动过程中会占粘于浏览器上,达到方便网站页面浏览的效果,也是一种用户体验,下面我们看一下是怎么实现的: jQuery的 smint插件,也是一个导航菜单固定插件.当页滚动时,导航菜单 ...

  8. GOF业务场景的设计模式-----单例模式

    个人觉得 纯粹的学习设计模式,是不对的.也不能为了使用设计模式,而硬搬设计模式来使用 单例模式可能是 最简单的设计模式也是 大家知道最多的设计模式.当然 ,有很多种写法 定义:确保一个类只有一个实例, ...

  9. SharePoint Server 2010 中的基本任务

    SharePoint Foundation 和 SharePoint Server 概述 SharePoint Foundation 2010 是一项用于 SharePoint 网站的基础技术,它可以 ...

  10. OC第五节 ——点语法和@property

    一.setter和getter函数     1.回忆:如何访问对象中的成员变量    2.setter和getter函数的作用            setter  方法:   修改对象的字段/实例变 ...