CKEditor3.6.2和CKFinder2.1 配置方法

         项目中需要使用CKEditor控件来进行留言,今晚研究了下。我使用CKEditor3.6.2和CKFinder2.1 现介绍下方法

1、              把CKEditor3.6.2中的ckeditor文件夹(这个文件夹一般在ckeditor_aspnet_3.6.2\_Samples目录下,只要你能找到ckeditor这个文件夹就好办)复制到你的web项目的根目录中,然后引用CKEditor.NET.dll文件(在_Samples\bin目录下,最好把他复制到项目中的ckeditor文件夹中在引用)

2、              把 CKFinder2.1中的的ckfinder文件夹复制到你的web项目的根目录中,然后引用CKFinder.dll(在ckfinder\bin\Release目录下)

在VS工具箱中添加选项卡,并右击选择“选择项”浏览把CKEditor.NET.dll和CKFinder.dll(这个基本不用),然拖拽CKEditorControl到页面!

3、              这时我们把ckeditor中的ckeditor.js和ckfinder中的ckfinder.js拖拽到页面上如:

<script src="ckeditor/ckeditor.js" type="text/javascript"></script>

<script src="ckfinder/ckfinder.js" type="text/javascript"></script>

4、              为了CKEditor这个文本编辑器好看着,在CKEditor中的config.js添加如下代码:

config.language = 'zh-cn'; //设置中文语言 

    config.uiColor = '#AADC6E'; //编辑器颜色 

    config.font_names = '宋体;楷体_GB2312;新宋体;黑体;隶书;幼圆;微软雅黑;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana';

    config.toolbar_Full = [['Source', '-', 'Preview', '-', 'Templates'], ['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Print',

    'SpellChecker', 'Scayt'], ['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', 'CreateDiv'], ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],

    ['Link', 'Unlink', 'Anchor'], ['Image', 'Flash', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak'], '/', ['Styles', 'Format', 'Font', 'FontSize'],

    ['TextColor', 'BGColor'], ['Maximize', 'ShowBlocks', '-', 'About']];

    config.toolbar_Basic = [['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink', '-', 'About']];

    config.width = 700;

    config.height = 300;

 

    config.filebrowserBrowseUrl = '/ckfinder/ckfinder.html'; //上传文件时浏览服务文件夹

    config.filebrowserImageBrowseUrl = '/ckfinder/ckfinder.html?Type=Images'; //上传图片时浏览服务文件夹

    config.filebrowserFlashBrowseUrl = '/ckfinder/ckfinder.html?Type=Flash';  //上传Flash时浏览服务文件夹

    config.filebrowserUploadUrl = '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files'; //上传文件按钮(标签)

    config.filebrowserImageUploadUrl = '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images'; //上传图片按钮(标签)

config.filebrowserFlashUploadUrl = '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash'; //上传Flash按钮(标签)

}

运行该页面编辑框便出来了,图片也随之可以上传。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值