`
mengqingyu
  • 浏览: 333281 次
  • 性别: Icon_minigender_1
  • 来自: 天津
社区版块
存档分类
最新评论

(转载)CKEditor 3.0 配置 使用

阅读更多
CKEditor 3.0 配置 使用
2009-09-11 21:17
CKEditor 3.0安装配置,感觉比较简单,但本次没有涉及上传文件的配置,下篇文章将写一下如何将CKEditor的兄弟产品:ckfinder 功能强大的上传文件管理器整合进 CKEditor3.0

下载CKEditor 3.0,地址:http://ckeditor.com/

首先,下载下来解压后,把文件夹ckeditor放到你的站点。

其次,在你的网页里面加入下面脚本:

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

注意红色部分,这里根据你自己的编辑器路径修改,请务必配置正确。

再次,在需要引用CKEditor编辑器的地方加入下面代码:

            <textarea class="ckeditor" cols="80" id="editor1" name="editor1" rows="10">
                这里是内容
             </textarea>
             如果你是ASP.NET开发人员 可以写成:
             <textarea class="ckeditor" id="txtContent" runat="server" name="txtContent"></textarea>

或者:

      <textarea cols="80" id="editor1" name="editor1" rows="10">
                这里是内容
      </textarea>
     <script type="text/javascript">
      CKEDITOR.replace( 'editor1' );
     </script>


这样,一个编辑器就基本可以使用了。

--------------------------------------------------

配置属于自己的编辑器,配置Config.js文件(官方给出配置的几种方法,详见参考官方文档)如下:


http://docs.fckeditor.net/ckeditor_api/symbols/CKEDITOR.config.html#.autoUpdateElement
用记事本打开config.js文件,可看到下面代码:

CKEDITOR.editorConfig = function( config )
{
// Define changes to default configuration here. For example:
config.language = 'zh-cn'; //配置语言
//config.uiColor = '#FFF'; //背景颜色
//config.width = 500; //宽度
config.height = 400; //高度
config.skin='v2';
//工具栏
config.toolbar =
[
    ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
    ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
    ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
    ['Link','Unlink','Anchor'],
    ['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
    '/',
    ['Styles','Format','Font','FontSize'],
    ['TextColor','BGColor'],
    ['Maximize', 'ShowBlocks','-','Source','-','Undo','Redo']

];
};

为了减少编辑器的大小,可以删除一些不必要的文件,如把_samples、_source、_tests三个文件夹删除,进入lang文件目录,保留en.js、zh.js、zh-cn.js三个文件,其余的语言文件如果你用不到,可以删除。



本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/sgivee/archive/2009/09/17/4561657.aspx
分享到:
评论
3 楼 火牛火牛 2010-03-23  
怎用JS填入内容?


------------
http://autodvd.net/category-x%E6%B1%BD%E8%BD%A6%E9%98%B2%E7%9B%97%E5%99%A8%E9%81%A5%E6%8E%A7%E5%90%AF%E5%8A%A8x-6-CNY-cn-1.html
2 楼 xiaoqing20 2010-01-10  
有意思有意思!
1 楼 天涯之海 2009-12-11  
这样写,会有中文乱码
不知道能否解决一下

相关推荐

    CKEditor3.0稳定版

    CKEditor 是一款非常知名的...如果你在使用国内官网的最新版本时遇到问题,不妨试试这个经过验证的3.0稳定版,可能会有惊喜。同时,根据项目需求,利用CKEditor的API进行定制,可以让编辑器更好地服务于你的应用程序。

    CKeditor3.0详细配置[定义].pdf

    CKeditor 3.0版本是其历史上的一个重要里程碑,提供了一套详尽的配置选项,使得开发者可以根据需求定制编辑器的功能和外观。以下将详细介绍CKeditor 3.0的一些关键知识点。 1. **CKeditor的特点与用途**: - ...

    将CKfinder 整合进CKEditor3.0 的实例

    这篇内容我们将深入探讨如何将CKfinder整合进CKEditor 3.0,以便实现更丰富的文件上传和管理功能。 CKEditor 3.0 是CKEditor系列的一个版本,它提供了一个用户友好的界面,支持多种文本格式、样式和插件。它的核心...

    ckeditor_3.0.zip

    而“ckeditor”文件夹则可能包含编辑器的JavaScript文件、CSS样式表、图片资源以及必要的配置文件,这些文件是部署和运行CKEditor 3.0所必需的。 总的来说,CKEditor 3.0 是一个功能全面、易于集成的富文本编辑器,...

    ckeditor_3.0

    在压缩包中包含的"ckeditor"文件可能包含了 CKEditor 3.0 的源码、样例、文档、配置文件和必要的资源文件。开发者可以通过这些文件来了解其工作原理,进行自定义配置或开发新的插件。 总的来说,CKEditor 3.0 是一...

    比较好CKeditor v3.0 最新版(PHP)

    4. **多语言支持**:为了满足全球用户的需求,CKeditor 3.0内置了对多种语言的支持,包括中文,使得非英语用户也能方便地使用。 5. **图像管理**:CKeditor 3.0包含了图像上传和管理功能,用户可以轻松地将本地图片...

    将CKfinder整合进CKEditor3.0的新方法

    在本文中,我们将探讨如何将CKFinder与CKEditor 3.0进行整合,以便在内容编辑器中实现图像、文件和多媒体资源的上传和管理。CKFinder是一款强大的文件管理工具,而CKEditor则是一款广泛使用的富文本编辑器。CKFinder...

    轻松实现 CKfinder进驻CKEditor3.0

    总之,通过简单地配置CKEditor的初始化参数,我们可以轻松地将CKFinder整合到CKEditor 3.0中,无需修改压缩的JavaScript文件,从而实现高效、便捷的文件管理和编辑功能。对于那些希望提升网站内容编辑体验的开发者来...

    将CKfinder 整合进 CKEditor3.0的方法

    此外,CKFinder还支持自动检测图片并生成缩略图,由Fckeditor公司开发,可以与FckEditor或CKEditor配合使用,提升编辑体验。 CKEditor 3.0虽然进行了全面的更新,但默认并未包含文件上传功能。为了弥补这一不足,...

    ckeditor_3.0.tar.gz

    FCKeditor是sourceforge.net上面的一个开源项目,主要是实现在线网页编辑器的功能,可以让web程序拥有如MS Word这样强大的编辑功能。官方网站为http://www.fckeditor.net ,在服务器端... 这里是最新版的ckeditor3.0

    ckeditor及配置方法

    **ckeditor及配置方法** ...总结,CKEditor是一个强大且灵活的富文本编辑器,通过合理的配置和API使用,可以轻松集成到你的项目中,提升用户体验。了解其配置和API,能帮助你定制出满足特定需求的在线编辑环境。

    ckeditor4.2.2自定义配置

    **ckeditor4.2.2自定义配置** CKEditor是一款强大的富文本编辑器,广泛应用于网页内容编辑、CMS系统以及各种在线文档处理。CKEditor 4.2.2是该系列的一个较早版本,但仍然包含丰富的功能和高度的可定制性。在实际...

    ckeditor配置(详细)

    本文将深入解析CKEditor的配置方法及常用配置参数,帮助开发者更好地掌握其使用技巧。 #### 一、CKEditor的基本使用 1. **引入CKEditor核心文件**:要在页面中使用CKEditor,首先需要在`&lt;head&gt;`标签内引入CKEditor...

    ckeditor的详细配置

    ### ckeditor的详细配置 ckeditor是一款非常流行的富文本编辑器,它是FCKeditor的后续版本,广泛应用于网页开发中,支持多种浏览器环境。本文将详细阐述如何进行ckeditor的基本配置及高级定制,帮助开发者更好地...

    ckeditor配置上传视频

    最近项目开发需要用到CKEditor在线编辑器,但发现他本身没有自带,所以需要自己手动配置插件。但网上很多配置都有问题,自己摸索了好久终于搞定。需要注意的细节有:flvPlayer文件夹的内容直接放在ckeditor文件夹...

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

    CKEditor是一款广泛使用的开源HTML在线文本编辑器,它允许用户以WYSIWYG(所见即所得)的方式编辑内容,类似于Microsoft Word等桌面文本处理软件。CKEditor支持丰富的功能,如字体样式、颜色、图像插入、链接创建、...

    ckeditor3.6配置

    CKEditor 作为一款广泛使用的富文本编辑器,其强大的功能和灵活的配置选项受到了众多开发者的青睐。本文将详细介绍如何在 ASP.NET 和 HTML 页面中集成并配置 CKEditor 3.6 版本。 #### 二、CKEditor 基本配置 ####...

    CKeditor配置使用[参照].pdf

    在本文中,我们将深入探讨如何配置和使用CKeditor,以及它的一些关键配置参数。 首先,要使用CKeditor,你需要从其官方网站[http://ckeditor.com/](http://ckeditor.com/)下载所需版本。在这个例子中,我们使用的是...

Global site tag (gtag.js) - Google Analytics