ckeditor+ckfinder使用方法



撰写新文章 ‹ 红颜丽人 — WordPress.htm。

http://ckeditor.com/download/ 下载ckeditor http://ckfinder.com/download下载ckfinder
如果您不愿意在官方下载 可以在CSDN上下载http://download.csdn.net/detail/accesszhb/4468438
一.ckeditor 精简
精简前:4.52M
精简后:853K
1.删除_samples和_source文件夹,分别为示例文件和未压缩源程序
2.删除lang文件夹下除zh-cn.js,en.js下的所有语言文件.根据需要删除
3.删除根目录下的changes.html(更新列表),install.html(安装指向),license.html(使用许可).
4.删除skins目录下不需要的皮肤.我一般用V2(简单.朴素)
//如果只保留V2则必须在config.js中指定皮肤
二.ckeditor 相关文件配置路径
1./ckeditor.js
核心文件,调用需加载
2./config.js 配置文件,参数配置均在此完成
三.ckeditor应用(.net环境)
1.引用js脚本
2.将相应的控件替换成编辑器代码

if (CKEDITOR.instances['Content']) {
CKEDITOR.remove(CKEDITOR.instances['Content']);
}//如果实例已存在
var editor = CKEDITOR.replace(‘Content’);//实例化
editor.BasePath = “Scripts/ckfinder/”;
CKFinder.setupCKEditor(editor, “/ckfinder/”);//相对路径
四.ckeditor配置(config.js配置文件)
以下只是必要的配置 其他更多配置属性在其它博客上查询这里就不具体罗列
CKEDITOR.editorConfig = function (config) {
config.language = ‘zh-cn’;
config.toolbar = ‘Basic’;
config.toolbar = ‘Full’;
config.toolbar_Full = [
['Source', '-', 'Save', 'NewPage', 'Preview', '-', 'Templates'],
['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Print', ],
//['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'RemoveFormat'],
['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'],
‘/’,
['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'],
['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote'],
['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
['Link', 'Unlink', 'Anchor'],
['Image', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak'],
‘/’,
['Styles', 'Format', 'Font', 'FontSize'],
['TextColor', 'BGColor']
];

config.filebrowserBrowseUrl = ‘/Scripts/ckfinder/ckfinder.html’; //上传文件时浏览服务文件夹
config.filebrowserImageBrowseUrl = ‘/Scripts/ckfinder/ckfinder.html?Type=Images’; //上传图片时浏览服务文件夹
config.filebrowserFlashBrowseUrl = ‘http://www.cnblogs.com/Scripts/ckfinder/ckfinder.html?Type=Flash’; //上传Flash时浏览服务文件夹
config.filebrowserUploadUrl = ‘/Scripts/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files’; //上传文件按钮(标签)
config.filebrowserImageUploadUrl = ‘http://www.cnblogs.com/Scripts/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images’; //上传图片按钮(标签)
config.filebrowserFlashUploadUrl = ‘http://www.cnblogs.com/Scripts/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash’; //上传Flash按钮(标签)
};
五、如果遇到此报错:未能加载类型“CKFinder.Connector.Connector”。
在WebSite添加引用CKFinder.dll 在你下载的ckfinder—>bin—>DeBug目录下
六、CKEditor的取值和赋值
修改为:
myeditor.document.getBody().getText(); //取文本形式的值
myeditor.document.getBody().getHtml(); //取包含html代码的值
//赋值
CKEDITOR.instances['Content'].setData(‘内容’);//从此方法可以得出结论CKEDITOR.instances['Content']就是获取ckeditor的实例
如果要赋值那么就是 myeditor.setData(“需要赋值的内容”);
http://wenku.baidu.com/view/7c3e98738e9951e79b892757.html 此博文有该控件的使用方法
七、去除上传图片功能中的浏览服务器按钮
打开ckeditor\plugins\image\dialogs\image.js文件,搜索browseServer,找到该词第一次出现的位置,在后面添加,style:’display:none;’。
第二个browseServer位置是第二菜单:超链接的“浏览服务器”按钮,也可按上种办法去掉
http://www.cnblogs.com/guanhp2013/archive/2012/03/06/2381203.html 圆友此控件.net下使用的博文