• CKEditor 3.0的简单安装配置使用

    日期:2010-03-20 | 分类:技术类

     

    CKEditor 3.0的简单安装配置使用

    CKEditor 3.0安装配置,感觉比较简单,但本次没有涉及上传文件的配置,只是简单的配置使用。

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

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

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

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

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

                

    或者:

          

        

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

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

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

    用记事本打开config.js文件,可看到下面代码:

    CKEDITOR.editorConfig = function( config )

    {

    // Define changes to default configuration here. For example:

    config.language = 'en';

    config.uiColor = '#F00';

    };

    我们只需在函数里面加入自己需要配置的选项即可,例如本人配置的:

    CKEDITOR.editorConfig = function( config )

    {

    // Define changes to default configuration here. For example:

    // config.language = 'zh-cn'; //配置语言

    //config.uiColor = '#FFF'; //背景颜色

    //config.width = 500; //宽度

    config.height = 500; //高度

    //工具栏

    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']

    ];

    };

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

    CKEditor瘦身:如果你觉得整个编辑器太大,你可以删除文件。

    例如把_samples、_source、_tests三个文件夹删除,进入lang文件目录,保留en.js、zh.js、zh-cn.js三个文件,其余的语言文件如果你用不到,可以删除。
    更详细配置选项,请参考官方文档 http://docs.fckeditor.net/CKEditor_3.x/Developers_Guide

    FCKeditor新版发布,并更名为CKeditor