FCKeditor添加自定义按钮


Posted in PHP onMarch 27, 2008

在FCKeditor目录里的fckconfig.js打开,找到FCKConfig.ToolbarSets["Default"] 这里的设置是配置功能按钮的,你需要的留下,不需要的可以删掉,也可以注释掉。

如需要多种配置,可以设置多个FCKConfig.ToolbarSets["你自己命个名name"] 后面跟配置详情。在引用编辑器的时候,以PHP为例:把fckeditor.php复制一个命名fckeditor1.php,在这里可以改配置。($this->ToolbarSet= '你自己命的名name' ;)

<?php 
include("editor/fckeditor1.php") ;//这里调用 
$oFCKeditor = new FCKeditor('FormContent') ;//实例化 
$oFCKeditor->BasePath = 'editor/';//这个路径一定要和上面那个引入路径一致,否则会报错:找不到fckeditor.html页面 
//$oFCKeditor->Value = '' ;  
$oFCKeditor->Width = '100%' ; 
$oFCKeditor->Height = '300' ; 
$oFCKeditor->Create() ; 
?>

下面是其他网友的补充,很详细,也可以参考下:
FCKeditor是一款非常流行的WEB可视化编辑器,其程序的的成熟度也非常高、功能丰富,但是再丰富也无法完全满足我们的实际要求,有时我们还是需要增加一些自己的功能。但FCKeditor的程序结构还是比较复杂的,对JS不是很了解的人很难对其灵活定制,本文就如何为FCKeditor的工具条增加一个打开我的像册的自定义按钮做一介绍。

先看看效果:

增加按钮有以下几步:

1、为按钮增加图片:

FCK的所有按钮图片是存放在一个图片文件里的,这一点比较独特,文件存放在相应皮肤目录下,如:/FCK/skins/silever/fck_strip.gif。通过Fireworks或Phtoshop打开该文件可以发现一个很长的图片,里面包含所有按钮的图片,现在您可以在该图片的最下面增加您自定义的按钮,注意,每个按钮的尺寸是16*16px。

2、为按钮增加功能代码:

增加按钮需要对FCK/editor/js目录中的两个核心文件进行修改:fckeditorcode_gecko.js和fckeditorcode_ie.js,前者是使用于gecko核心的浏览器如Firefox等,而后者应用于以IE为核心的浏览器如MyIE(傲游)等,这两个文件大体是相似的,仅有微小差别,在此我们基本无须担心。

修改的方法非常简单,基本是一个照葫芦画瓢的过程,首先我们找一个与我们将要添加的按钮功能相似的一个按钮,这里我们选择了Newpage,这是一个清空编辑器以备新建一个文件的按钮。首先我们修改fckeditorcode_ie.js,fckeditorcode_gecko.js直接复制更改的代码就可以了。

打开fckeditorcode_ie.js,这里需要说明的是,fckeditorcode_ie.js是多个文件合并经过代码优化的(即去掉了大部分换行、空格、注释等)不是很容易阅读,而且这样一百多K的JS文件用Dreamweaver、ZDE等工具打开后CPU立刻升至100%,相信计算机就变成痴呆一样了,经过一翻比较,发现曾被我认为一文不值的Golive竟然可以轻松打开该文件并快速编辑!不管你用什么软件反正能打开并编辑就行了。以关键词Newpage进行查找,你会发现一个按钮的功能定义分三大部分:

A、功能原型

// 按钮功能原型

var FCKNewPageCommand=function(){this.Name='NewPage';};

FCKNewPageCommand.prototype.Execute=function(){FCKUndo.SaveUndoStep();FCK.SetHTML('');FCKUndo.Typing=true;};

FCKNewPageCommand.prototype.GetState=function(){return FCK_TRISTATE_OFF;};

var FCKMyAlbumCommand=function(){this.Name='DISPLAY: none';};

FCKMyAlbumCommand.prototype.Execute=function(){if(typeof(parent.showMyAlbum)=="function"){parent.showMyAlbum(FCK);}else{alert(FCKLang.NoAlbum);}};

FCKMyAlbumCommand.prototype.GetState=function(){return FCK_TRISTATE_OFF;};

B、功能的实例化

case 'NewPage':B=new FCKNewPageCommand();break;

case 'MyAlbum':B=new FCKMyAlbumCommand();break;

C、按钮的显示

case 'NewPage':B=new FCKToolbarButton('NewPage',FCKLang.NewPage,null,null,true,null,4);break;

case 'MyAlbum':B=new FCKToolbarButton('MyAlbum',FCKLang.MyAlbum,null,null,true,null,67);break;

上面代码中第一部分是Newpage的原代码,后一部分是我们自定义的代码,您一看应该明白怎么回事了吧?仅红色部分和名称不同而已!而红色部分就是我们的自定义功能。

FCKLang是语言包对象,您只要打开FCK/editor/lang/下面的相应语言包添加相应的名称属性就可以了,比如:MyAlbum打开我的像册。注意大小写!至此我们的添加工作已完成。

PHP 相关文章推荐
用PHP将数据导入到Foxmail
Oct 09 PHP
基于mysql的bbs设计(四)
Oct 09 PHP
PHP6 mysql连接方式说明
Feb 09 PHP
关于UEditor编辑器远程图片上传失败的解决办法
Aug 31 PHP
解析:使用php mongodb扩展时 需要注意的事项
Jun 18 PHP
smarty模板引擎之配置文件数据和保留数据
Mar 30 PHP
你应该知道PHP浮点数知识
May 13 PHP
WordPress中设置Post Type自定义文章类型的实例教程
May 10 PHP
PHP数组生成XML格式数据的封装类实例
Nov 10 PHP
php中的单引号、双引号和转义字符详解
Feb 16 PHP
laravel实现简单用户权限的示例代码
May 28 PHP
laravel-admin的图片删除实例
Sep 30 PHP
php,ajax实现分页
Mar 27 #PHP
PHP 5.0对象模型深度探索之类的静态成员
Mar 27 #PHP
PHP 5.0对象模型深度探索之对象复制
Mar 27 #PHP
PHP 5.0对象模型深度探索之属性和方法
Mar 27 #PHP
php简单静态页生成过程
Mar 27 #PHP
优化PHP代码的53条建议
Mar 27 #PHP
PHP连接access数据库
Mar 27 #PHP
You might like
德生PL450的电路分析和低放电路的改进办法
2021/03/02 无线电
请离开include_once和require_once
2013/07/18 PHP
php多层数组与对象的转换实例代码
2013/08/05 PHP
微信第三方登录(原生)demo【必看篇】
2017/05/26 PHP
PHP实现动态压缩js与css文件的方法
2018/05/02 PHP
jquery限定文本框只能输入数字即整数和小数
2013/11/29 Javascript
js中Math之random,round,ceil,floor的用法总结
2013/12/26 Javascript
jQuery实现瀑布流布局详解(PC和移动端)
2020/09/01 Javascript
Jquery 1.9.1源码分析系列(十二)之筛选操作
2015/12/02 Javascript
Javascript发送AJAX请求实例代码
2016/08/21 Javascript
深入浅出 jQuery中的事件机制
2016/08/23 Javascript
jQuery实现锚点向下平滑滚动特效示例
2017/08/29 jQuery
微信小程序switch组件使用详解
2018/01/31 Javascript
vue.js 实现图片本地预览 裁剪 压缩 上传功能
2018/03/01 Javascript
vuejs 动态添加input框的实例讲解
2018/08/24 Javascript
angular4自定义组件非input元素实现ngModel双向数据绑定的方法
2018/12/28 Javascript
electron-vue利用webpack打包实现多页面的入口文件问题
2019/05/12 Javascript
详解webpack-dev-middleware 源码解读
2020/03/23 Javascript
js面向对象方式实现拖拽效果
2021/03/03 Javascript
Python发送http请求解析返回json的实例
2018/03/26 Python
使用Python实现跳帧截取视频帧
2019/05/31 Python
Django stark组件使用及原理详解
2019/08/22 Python
使用Python内置模块与函数进行不同进制的数的转换
2020/04/26 Python
python 基于opencv 绘制图像轮廓
2020/12/11 Python
一款利用html5和css3实现的3D立方体旋转效果教程
2016/04/26 HTML / CSS
HTML5 history新特性pushState、replaceState及两者的区别
2015/12/26 HTML / CSS
英国家庭、花园、汽车和移动解决方案:Easylife Group
2018/05/23 全球购物
Expedia法国:全球最大在线旅游公司
2018/09/30 全球购物
师范生自荐信范文
2013/10/06 职场文书
员工自我鉴定
2013/10/09 职场文书
餐饮总经理岗位职责
2014/03/07 职场文书
企业挂职心得体会
2014/09/10 职场文书
2015年爱国卫生工作总结
2015/04/22 职场文书
2016年幼儿园教师师德承诺书
2016/03/25 职场文书
创业计划书之烤红薯
2019/09/26 职场文书
Python Pytorch查询图像的特征从集合或数据库中查找图像
2022/04/09 Python