通过在网上搜寻资料终于把CKEditor3.2和 CKFinder1.43集成在ASP.NET中使用了!!
CKEditor3.2和 CKFinder1.43官方网站:
http://ckeditor.com/
http://ckfinder.com/
配置方法:
1,到官方网站下载CKEditor3.2.rar和CKFinder1.43.rar文件,分别解压后放到将两个文件夹拷贝到网站的根目录下,CKEditor是编辑器,它本身并没有上传功能,所以需要集成CKFinder的上传功能。
2,将CKFinder文件夹里的bin目录下的CKFinder.dll文件拷到你自己网站的bin目录下
3,创建一个上传文件的目录upload。在默认配置的情况下,/ckfinder/userfiles/是上传目录;如果想修改上传目录,修改 config.ascx文件中的BaseUrl = "/upload/",这里是以根目录作为绝对路径的目录,注意以反斜杠结尾。
4,确保你的文件夹能被网络访问写入。在Windows里,给IUSR_<ServerName>用户写权限;CKFinder可以结合 session来判断用户是否有权限进行上传。如果不需要进行用户身份验证,那么修改config.ascx文件里的 CheckAuthentication()函数,直接返回true。要进行身份验证,也是修改这个函数。
5,去掉上传功能中讨厌的水印提示,打开ckfinder—core—js目录下的ckfinder_gecko.js和ckfinder_ie.js两个文件,直接查找en.call(window,qo); 并注释掉就ok了。
6,在页面中嵌入编辑器。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>ckeditor</title>
<script src="ckeditor/ckeditor.js" type="text/javascript"></script>
<script src="ckfinder/ckfinder.js" type="text/javascript"></script>
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#btn").click(function(){
var oEditor = CKEDITOR.instances.txtCk;
alert( oEditor.getData() );
});
$("#btn1").click(function(){
var oEditor = CKEDITOR.instances.txtCk;
var str="ASP.NET中CKEditor3.2和CKFinder1.43的配置和使用!"
oEditor.setData("<h3 style='color:blue; text-align:center;'>"+str+"</h3>");
});
});
</script>
</head>
<body>
<div style="width:900px; height:500px; margin :20px auto;">
<!-- 嵌入编辑器开始-->
<textarea id="txtCk" cols="80" rows="50" name="txtCk" ></textarea>
<script type="text/javascript">
if (typeof CKEDITOR == "undefined") {
document.write("加载CKEditor失败");
}
else {
var editor = CKEDITOR.replace("txtCk");
CKFinder.SetupCKEditor(editor, "ckfinder/"); //ckfinder总目录的相对路径.
}
</script>
<!-- 嵌入编辑器结束-->
<br />
<input type="button" id="btn" value="获取内容"/>
<input type="button" id="btn1" value="设置内容"/>
</div>
</body>
</html>
7,打开ckeditor目录下的文件config.js文件,对编辑器进行个性化配置。
CKEDITOR.editorConfig = function( config )
{
//更多的相关配置请参考官方文档
config.language = 'zh-cn';//中文
config.uiColor = '#AADC6E';//编辑器颜色
config.height="220";//宽度
config.width="820";//高度
};
通过以上配置就可以体验新版的编辑器了,对于目录中一些没必要的文件可以自行删除,最后附上效果图!
分享到:
相关推荐
本版本为CKEDITOR 3.2 和CKFINDER 1.43 的结合版本!拥有图片上传和文件管理的综合功能!欢迎使用!能够将UTF-8模式上上传中文图片转化为以时间重命名图片问题,解决浏览时图片无法显示,图片乱码问题!简化优化版!
Asp.net 中ckeditor结合ckfinder的使用(文本编辑器)
asp.net 使用ckeditor5富文本编辑器包含图片上传全部代码
.NET环境下ckeditor与ckfinder配置(附ckfinder1.x注册机)
Asp.net 最新版CKEditor+CKFinder配置实现图片上传
asp.net ckeditor3.6+ckfinder2.1(完美破解),压缩包里面有完整的项目。
Asp.Net mvc3中ckeditor4.4.0与ckfinder配置上传图片。
.net环境下ckeditor与ckfinder实例 .net中ckeditor,ckFinder的使用
CKEditor 3.6 和 CKFinder 2.2 for ASP.NET 二者zip打包下载。 解压即可。
功能现在完善好了,可以直接使用ckeditor 3.6.2 和 ckfinder 2.2
Ckeditor4.0 +ckfinder_aspnet_2.3都是目前最新版本。经过自己很长时间的配置终于成功了,在些分享给大家。一定物超所值
ckeditor3.6_ckfinder2.0.2破解,整合,已经配置好,可以直接调用,asp.net版本 ckeditor3.6_ckfinder2.0.2破解,整合,已经配置好,可以直接调用,asp.net版本 ckeditor3.6_ckfinder2.0.2破解,整合,已经配置好,可以...
ASP.NET部署ckeditor_3.6.2及插件ckfinder_aspnet_2.1
开发中的终结版,狼王编辑器,打包下载。 CKEditor 4.0和CKFinder 2.1 在验证中,可以加入限制IP地址...2.ckfinder中,config.ascx 这里可以配置到 web.config中, 方便统一设置BaseUrl = "~/ckfinder/userfiles/";
CKEditor4+ckfinder ASP.NET 支持图片上传
asp.net页面中CKEDITOR文本编辑框,配置上传图片的功能,搞了好久,终于弄出来了。
从http://cksource.com网站上下载CKEditor与CKFinder,并将这两个解压的项目之下,里面的 samples文件夹中是示例,是不需要的可以将samples文件夹直接删除,在ckeditor和ckfinder目录下各有bin目录,添加对bin目录下...
例如 BiDi 支持、通过鼠标修改表格列的宽度、在表格上的TAB键处理、只读区域等等,本人使用的是.net 4.0,如果你的是vs2005或2008,只用新建一个网站,把所下载的文件(除webconfuger外)复制到网站目录中即可!...
使用ckeditor作为富文本编辑器,ckfinder作为文件上传工具,详细图文教程可以查看本人的blog,这里是源代码。