ckeditor的前身是FCKeditor。
目前介绍 ckeditor 4.5.1 Standard(标准版) 同时结合ckfinder 完成上传图片和上传链接文件;
一、CKEditor4.5.1 标准版
在ckeditor官网中http://ckeditor.com/download下载页面中选择 Standard Package 选项 进行下载;
解压后,文件夹复制到根目录下;
在想要添加编辑器的页面中 引用ckeditor目录下ckeditor.js,
<script type="text/javascript">
var editor=null;
window.onload = function()
{
editor= CKEDITOR.replace( 'bz' ),{ };
};
</script>
div中添加 <textarea id="bz" runat="server" rows="30" cols="50" ></textarea> 如在不需要 上传图片和上传链接文件功能的情况下,这样编辑器已经可以正常运行显示了。
如需要上传图片和上传链接文件的功能,需在ckeditor官网中下载ckfinder ,解压后把ckfinder文件夹复制到和之前ckeditor在同一目录下。修改点击上传图片后预览区域显示内容 :在config.js中添加config.image_previewText=' ';需是空格不可为null的字符串 ,如果这样仍然显示的话,就需要在plugins/image/dialogs/image.js这里的image.js中进行删除修改了(具体删除哪里网上有),如不需要浏览服务器按钮,可是在iamge.js中修改(修改方法:查找搜索browseServer,找到该词第一次出现的位置,在后面修改, 添加/修改 dipaly:none属性);
在config.js中添加
filebrowserBrowseUrl = '/editor/ckfinder/ckfinder.html';//上传文件时浏览服务文件夹
filebrowserImageBrowseUrl = '/editor/ckfinder/ckfinder.html?type=Images';//上传图片时浏览服务文件夹
filebrowserFlashBrowseUrl = '/editor/ckfinder/ckfinder.html?type=Flash'; //上传Flash时浏览服务文件夹
filebrowserUploadUrl = '/editor/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files'; //上传文件按钮(标签)
filebrowserImageUploadUrl = '/editor/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images';//上传图片按钮(标签)
filebrowserFlashUploadUrl = '/editor/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash'; //上传Flash按钮(标签)
在项目中引用ckfinder中bin下的dll,如此可正确完成上传;
本文介绍了如何在网站中整合CKEditor4.5.1标准版并结合ckfinder实现上传图片和链接文件的功能。包括下载、配置、引入相关DLL等步骤,以及详细的操作指南。
1万+

被折叠的 条评论
为什么被折叠?



