当前位置: 首页 > 图文教程 > 网络编程 > 网页编辑器 > FCKeditor 插件开发 示例(详细版本)

网页编辑器
FCKeditor 2.0 简化和使用
jsp fckeditor 上传中文图片乱码问题的解决方法
IE8 Fckedit2.6.X不兼容
fckeditor php上传文件重命名的设置
FCKeditor 新闻组件的一些程序漏洞
FckEditor 配置手册中文教程详细说明
Windows Live Writer 实现代码高亮
FckEditor 中文配置手册详细说明
FCKEidtor 自动统计输入字符个数(IE)
nicedit 轻量级编辑器 使用心得
FCKEditor 表单提交时运行的代码
FCKeditor 插件开发 示例(详细版本)
fckeditor 插件实例 制作步骤
fckeditor 插件开发参考文档
fckeditor 常用函数
FCKeditor ASP.NET 上传附件研究
FCKEditor SyntaxHighlighter整合实现代码高亮显示
HTML 编辑器 FCKeditor使用详解
fckeditor 代码语法高亮
eWebEditor 辑器按钮失效 IE8下eWebEditor编辑器无法使用的解决方法

网页编辑器 中的 FCKeditor 插件开发 示例(详细版本)


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-01-10   浏览: 197 ::
收藏到网摘: n/a

(FCKeditor.地址是:http://www.fckeditor.net/.我下载的版本是:2.6.3。)
What ?
FCKeditor一直是web上编辑器的比较好的一个选择,他是开源的,而且效果不错。FCKeditor的插件是对FCKeditor的扩展功能。
Why?
尽管一般条件下FCKeditor能适应使用,但你可能对FCKeditor仅有的功能不满意,好.FCKeditor提供了插件开放功能,只要你能想到,你就做吧。
How?
我就一个简单的"Hello"为例来介绍FCKeditor插件的开发(申明:俺也是菜鸟,有啥不对的地方,请指出来,大家进步啦。)
首先,进入FCKeditor编辑器目录下的editor文件下的plugins目录下。这个目录是放Fckeditor插件的。So,建立一个文件夹,命名为'hello'。
第二步,进入'hello'文件夹。建立一个"fckplugin.js"的文件。这是fckeditor插件的所必须的,主要是插件注册等等。
再建立语言文件。在'hello'文件夹下建立一个'lang'的文件夹。在'lang'文件夹下建立语言文件,Fckeditor插件的语言文件命名方式是:国家或地区.js。如中国是zh.js.简体中文是zh-cn.js.英文是en.js等等。我们建立两个"en.js"和"zh-cn.js"。
然后编辑语言文件。我们编辑"en.js"。写入以下内容:FCKLang.Hello="Hello";(注意包含";",js的代码嘛),在"zh-cn.js"中写入:FCKLang.Hello="你好";
FCKeditor插件语言的命名方式为:FCKLang.变量名="语言定义"
OK,语言问题定义完成了,然后是插件定义。
打开第二步的"fckplugin.js"。
复制代码 代码如下:

//注册
FCKCommands.RegisterCommand('hello',new FCKDialogCommand('hello',FCKLang.HelloB,FCKPlugins.Items['hello'].Path+"hello.html",200,200));
//定义工具栏
var NHello=new FCKToolbarButton('hello',FCKLang.Hello);
NHello.IconPath=FCKPlugins.Items['hello'].Path+'hello.GIF';
//注册
FCKToolbarItems.RegisterItem('hello',NHello);

OK,不懂?详细说明:

插件机制:注册命令-定义工具栏-注册到工具栏

注册命令::FCKCommands.RegisterCommand(命令名称,对话框命令)

对话框命令:FCKDialogCommand(命令名称,对话框标题,URl,宽度,高度)

这样注册命令就完成,然后定义一个工具栏

FCKToolbarButton(命令名称,按钮标题)

你最好添加一个图标:IconPath=图标地址

现在命令也注册完成,工具栏也定义好了,然后是添加:

FCKToolbarItems.RegisterItem(命令名称,工具栏);

注意:”Hello.html”就是你要显示html中应该包含如下语句.

复制代码 代码如下:

<script language="javascript">
var dialog = window.parent ;
var oEditor = dialog.InnerDialogLoaded() ;
var FCKLang = oEditor.FCKLang ;
</script>

OK.插件制作完毕了,怎么显示呢?

在Fckeditor的目录下找到 “fckconfig.js”,这是fckeditor的设置文件。找到

” FCKConfig.PluginsPath = FCKConfig.BasePath + 'plugins/' ;”

添加:”FCKConfig.Plugins.Add(‘hello','zh-cn,en');

解释:FCKConfig.Plugins.Add(插件名,'语言文件');其中语言文件是可选的,如果没有则自动设置。

然后在 “FCKConfig.ToolbarSets["Default"]=..”中的”[]”中随便添加'hello' (注意包含引号)

OK…!完成

好,我们来重新确认一下FCKEditor插件开发的过程:

建立” fckplugin.js”-建立插件(语言文件等)-添加插件。

建立插件必要步骤:插注册命令-定义工具栏-注册到工具栏