CKEditor+CKFinder 解决上传图片路径问题

之前用的freetextbox可视化编辑器，一直解决不了上传图片到指定路径的问题，但是项目偏偏需要这个功能的，

无奈之下只有百般搜索，呵呵终于功夫不负有心人。CKEditor+CKFinder就解决了我的燃眉之急。

使用方法如下

CKEditor：

1.解压CKEditor到webRoot目录，在应用页面加载其ckeditor.js ;

2.页面textarea：

< textarea  cols ='80'  name ='editor1'  rows ='10' > textarea >

CKFinder：

3.解压CKFinder到webRoot目录（最好与CKEditor同级） ;

4.页面script：（最好textarea之后）

 

代码

//
    CKEDITOR.replace( ' <%=mckeditor.ClientID %> ' ,
{
    language:  ' zh-cn ' ,
    skin:  ' kama ' ,
    uiColor:  ' #9EBEF5 ' ,
    width:  ' 600 ' ,
    enterMode: Number( 2 ),
    shiftEnterMode: Number( 1 ),
    filebrowserBrowseUrl:  ' <%=ResolveUrl("~/ckfinder/ckfinder.html")%> ' ,
    filebrowserImageBrowseUrl:  ' <%=ResolveUrl("~/ckfinder/ckfinder.html?Type=Images")%> ' ,
    filebrowserUploadUrl:  ' <%=ResolveUrl("~/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files")%> '
  });
// ]]> 

5、修改config.ascx文件中的BaseDir="d:\images\"（如果为空是相对路径，否则为绝对路径），BaseUrl = "/uploads/"（文件上传目录） 和CheckAuthentication()上传身份验证；

6.在ckeditor\config.js中的CKEDITOR.editorConfig里加入以下需要自定义的配置代码：

 

代码

CKEDITOR.editorConfig  =   function (config) {
// 配置默认配置
config.language  =   ' zh-cn ' ;  // 配置语言
config.uiColor  =   ' #FFF ' ;  // 背景颜色
 config.width  =   400 ;  // 宽度
 config.height  =   400 ;  // 高度
 config.skin  =   ' v2 ' ;  // 编辑器皮肤样式
//  取消 “拖拽以改变尺寸”功能
 config.resize_enabled  =   false ;
//  使用基础工具栏
 config.toolbar  =   " Basic " ;
//  使用全能工具栏
config.toolbar  =   " Full " ;
// 使用自定义工具栏
 config.toolbar  =
 [
 [ ' Source ' ,  ' Preview ' ,  ' - ' ],
 [ ' Cut ' ,  ' Copy ' ,  ' Paste ' ,  ' PasteText ' ,  ' PasteFromWord ' , ],
 [ ' Undo ' ,  ' Redo ' ,  ' - ' ,  ' Find ' ,  ' Replace ' ,  ' - ' ,  ' SelectAll ' ,  ' RemoveFormat ' ],
 [ ' Image ' ,  ' Flash ' ,  ' Table ' ,  ' HorizontalRule ' ,  ' Smiley ' , SpecialChar ' , ' PageBreak ' ],
  '/ ',
 [ ' Bold ' ,  ' Italic ' ,  ' Underline ' ,  ' - ' ,  ' Subscript ' ,  ' Superscript ' ],
 [ ' NumberedList ' ,  ' BulletedList ' ,  ' - ' ,  ' Outdent ' ,  ' Indent ' ,  ' Blockquote ' ],
 [ ' JustifyLeft ' ,  ' JustifyCenter ' ,  ' JustifyRight ' ,  ' JustifyBlock ' ],
 [ ' Link ' ,  ' Unlink ' ,  ' Anchor ' ],
  ' / ' ,
 [ ' Format ' ,  ' Font ' ,  ' FontSize ' ],
[ ' TextColor ' ,  ' BGColor ' ],
 [ ' Maximize ' ,  ' ShowBlocks ' ,  ' - ' ,  ' About ' ]
 ];
};

转载于:https://www.cnblogs.com/TSPWater/archive/2010/06/04/1751307.html