加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

CKEditor 3.0安装配置使用

发布时间:2020-12-15 06:57:22 所属栏目:百科 来源:网络整理
导读:? CKEditor 3.0安装配置,感觉比较简单,但本次没有涉及上传文件的配置,只是简单的配置使用。 下载CKEditor 3.0,地址:http://ckeditor.com/ 首先,下载下来解压后,把文件夹ckeditor放到你的站点。 其次,在你的网页里面加入下面脚本: script type="text
?

CKEditor 3.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>

或者:

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


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

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

配置属于自己的编辑器,配置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']

];
};

更详细配置选项,请参考官方文档http://docs.fckeditor.net/ckeditor_api/symbols/CKEDITOR.config.html


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

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

例如把_samples、_source、_tests三个文件夹删除,进入lang文件目录,保留en.js、zh.js、zh-cn.js三个文件,其余的语言文件如果你用不到,可以删除。

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读