`
流星剑
  • 浏览: 94217 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

ckeditor的配置(html在线文本编辑器)

    博客分类:
  • .net
阅读更多

 

一.ckeditor 3.3.1精简
  1、删除_samples和_source文件夹,分别为示例文件和未压缩源程序
  2、删除lang文件夹下除zh-cn.js,en.js下的所有语言文件.根据需要删除
  3、删除根目录下的changes.html(更新列表),install.html(安装指向),license.html(使用许可).
  4、删除skins目录下不需要的皮肤.我一般用V2(简单.朴素)  //如果只保留V2则必须在config.js中指定皮肤
  5、删除根目录下的ckeditor.asp、ckeditor.php、ckeditor_php4.php、ckeditor_php5.php(asp和php版的文件).

二.ckeditor 3.3.1相关文件配置路径
  1、/ckeditor.js   核心文件,调用需加载
  2、/config.js     配置文件,参数配置均在此完成

三.ckeditor应用(.net环境)
   1、引用js脚本
   <script type="text/javascript" src="/ckeditor/ckeditor.js"></script>
   2、添加TextBox控件,class设置为ckeditor
   <asp:TextBox id="txtContent" class="ckeditor" TextMode="MultiLine"  Text='' runat="server" />

 四.ckeditor配置(config.js配置文件)
   详细api参数见:http://docs.cksource.com/ckeditor_api/,我的默认配置: //在 CKEditor 中集成 CKFinder,注意 ckfinder 的路径选择要正确。

 

    var ckfinderPath = "./js"; //ckfinder路径在根目录的网站下
    config.filebrowserBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html';
    config.filebrowserImageBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html?type=Images';
    config.filebrowserFlashBrowseUrl = ckfinderPath + '/ckfinder/ckfinder.html?type=Flash';
    config.filebrowserUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Files';
    config.filebrowserImageUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Images';
    config.filebrowserFlashUploadUrl = ckfinderPath + '/ckfinder/core/connector/aspx/connector.aspx?command=QuickUpload&type=Flash';

    //以上URL值需要根据你ckfinder路径的不同而不同   


    config.language = 'zh-cn'; //配置语言  
    config.width = 650; //宽度   
    config.height = 400; //高度
    config.skin = 'kama'; //编辑器样式(kama、office2003、v2)

    // 取消 “拖拽以改变尺寸”功能
    config.resize_enabled = true;

    // 基础工具栏
    config.toolbar = "Basic";

    // 全能工具栏
    config.toolbar = "Full";

    //自定义工具栏
    config.toolbar =
          [
          ['Source', '-', 'Preview'], ['Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord'], ['Undo', 'Redo', '-', 'Find', 'Replace', '-', 'SelectAll', 'RemoveFormat'], ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', 'Blockquote', 'ShowBlocks'], '/',
          ['Bold', 'Italic', 'Underline', 'Strike', '-', 'Subscript', 'Superscript'], ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'], ['Link', 'Unlink', 'Anchor'], ['Image', 'Flash', 'Table', 'HorizontalRule', 'SpecialChar'], '/',
          ['Styles', 'Format', 'Font', 'FontSize'], ['TextColor', 'BGColor'], ['Maximize', ]
          ];
一.ckfinder精简

   1、删除_samples和_source文件夹,分别为示例文件和未压缩源程序
   2、删除根目录下changelog.txt,install.txt,license.txt文件
   3、1.x版的删除core/lang目录下除en.js,zh-cn.js的所有语言文件(根据条件删除),2.0的删除lang和core/connector/aspx/lang目录下除en.js,zh-cn.js的所有语言文件;help目录除en外的其他目录

二.ckfinder配置
   1、复制/bin目录下的ckfinder.dll文件至站点bin目录
   2、复制ckfinder目录至站点根目录下(可另选择路径)

三.ckfinder应用
  1、与ckeditor集成,详情见官方文档,官方文档是加载修改,我用的方法是全局修改.

下面是ckfinder的config.ascx文件,找到下面的代码,然后对应着修改 // The base URL used to reach files in CKFinder through the browser.

BaseUrl = "~/ckfinder/userfiles/";//注意这里的路径为跟目录下(绝对路径)

   注意:本实例的代码提供下载,仅供参考!

 

 

分享到:
评论

相关推荐

    CKEDITOR MVC4 富文本编辑器 DEMO 图片上传

    这个DEMO是专门为新手设计的,旨在帮助他们快速理解和实现一个功能完备的在线文本编辑器。 在ASP.NET MVC4中集成CKEDITOR,首先你需要在项目中添加CKEditor的NuGet包,这将包含所有必要的JavaScript库和配置文件。...

    CKeditor富文本编辑器

    CKeditor是一款广泛应用于网站开发中的开源富文本编辑器,它为用户提供了一种类似Microsoft Word的交互体验,使得非HTML专业人士也能轻松编辑和格式化文本内容。这款编辑器的强大之处在于它的易用性和丰富的功能集,...

    富文本编辑器ckeditor使用手册

    富文本编辑器CKEditor是一款广泛应用于网页开发中的高级文本编辑工具,它提供了丰富的功能和高度的可定制性,使得开发者可以轻松创建具有专业外观的在线文本编辑区域。CKEditor不仅适用于初学者,也深受经验丰富的...

    CKeditor富文本编辑器插件资源

    总的来说,CKeditor富文本编辑器插件资源提供了构建强大、易用的在线文本编辑功能,无论是简单的文本编辑还是复杂的多媒体内容创作,都能得到很好的支持。开发者可以根据自身项目的需求,灵活地选择和配置CKeditor的...

    ckeditor_3.5.2(在线文本编辑器)

    CKEditor 3.5.2 是一款著名的在线文本编辑器,它被广泛应用于网页内容的创建和编辑。作为jQuery的一个插件,它为开发者提供了一种便捷的方式,将富文本编辑功能集成到他们的Web应用程序中。CKEditor允许用户在浏览器...

    CKeditor富文本编辑器的js压缩包

    CKeditor是一款广泛应用于Web开发的开源富文本编辑器,它为用户提供了一种在网页上创建、编辑和格式化文本的强大工具。这个js压缩包包含了CKeditor的核心组件和可能的插件,使得开发者能够轻松地集成到自己的网站或...

    asp.net 使用ckeditor5富文本编辑器包含图片上传全部代码

    在ASP.NET应用中,CKEditor5是一款常用的富文本编辑器,它提供了丰富的文本格式化功能,包括图片上传。本文将详细介绍如何在ASP.NET环境中集成CKEditor5并实现图片上传功能。 首先,我们需要在项目中引入CKEditor5...

    ckeditor富文本编辑器

    **ckeditor富文本编辑器详解** ckeditor是一款广泛应用的开源富文本编辑器,它的主要功能是为用户提供在网页上创建和编辑复杂内容的能力。就像我们在QQ空间发布日志时体验到的一样,ckeditor允许用户轻松地对文本...

    CKeditor在线文本编辑器

    CKeditor是一款广泛应用于网站开发的开源在线文本编辑器,它为用户提供了一个类似Word的富文本编辑体验,使得在网页上创建、编辑和格式化文本变得简单易行。CKeditor以前称为Fckeditor,随着时间的推移,它不断进化...

    在线文本编辑器ckeditor3.6.2 for JAVA

    在线文本编辑器是网页开发中不可或缺的工具,用于创建、编辑和格式化HTML内容,尤其在需要用户输入丰富格式文本的场景下。CKEditor是一款知名的富文本编辑器,提供了多种功能,如字体设置、段落调整、图片上传、链接...

    CKEditor在线文本编辑器开源框架

    CKEditor是一款广泛应用于Web开发领域的开源在线文本编辑器框架,其功能强大且高度可定制,为网站和应用程序提供了丰富的文本格式化和编辑选项。这款编辑器以其易用性、稳定性和跨浏览器兼容性而受到开发者们的青睐...

    Ckeditor,一个在线编辑器

    - Ckeditor 可以通过JavaScript API轻松集成到HTML页面中,只需引入相应的JS文件并配置编辑器实例。 - Java开发者可以通过提供的Java核心库,将Ckeditor与后端应用紧密结合,实现数据的动态交互和存储。 6. **...

    富文本编辑器ckeditor

    富文本编辑器CKEditor是一款广泛应用于网页开发中的高级文本编辑工具,它允许用户在网页上进行格式化文本的创建、编辑和管理。CKEditor以其强大的功能、易用性和高度可定制性著称,为开发者提供了丰富的API接口和...

    ckeditor文本编辑器

    **ckeditor文本编辑器详解** ckeditor是一款强大的富文本编辑器,广泛应用于网页内容的创建和编辑。它提供了丰富的功能,使得用户无需深入HTML和CSS代码,就能轻松实现对文本的格式化、图片插入以及自定义工具栏等...

    CKEditor 富文本编辑器 ckeditor-java-core

    CKEditor 是一款非常知名的开源富文本编辑器,广泛应用于网页开发中,为用户提供了一种方便的方式来创建和编辑具有格式化的文本内容。它支持多种语言,包括中文,且提供了丰富的插件和自定义选项,可以满足各种复杂...

    ckeditor4.0富文本编辑器

    **ckeditor4.0富文本编辑器** 富文本编辑器在网页开发中扮演着至关重要的角色,它允许用户在网页上创建、编辑和格式化文本,就像在桌面应用程序中一样。CKEditor 4.0是其中的一款强大且广泛使用的开源富文本编辑器...

Global site tag (gtag.js) - Google Analytics