毕业设计(十五)---发表文章(1)之- 发表文章和回复博客的2个简单ckeditor样式

本文链接：https://blog.csdn.net/mamba10/article/details/8543176

ckeditor 使用方法

使用方法：

1、在页面<head>中引入ckeditor核心文件ckeditor.js

2、在使用编辑器的地方插入HTML控件<textarea>

3、将相应的控件替换成编辑器代码【我发现不写这段js代码，也是可以使用的，关键是第2部，textarea的 class="ckeditor"】

CKEDITOR.replace('TextArea1');

</script>

默认样式：

上面的功能项太多，有好多用不到，若要定义新的样式，自己写一个ckeditor_config.js文件，代替原有文件。

如下：

一：

ckeditor_config_fabiao.js代码：

CKEDITOR.editorConfig = function( config )
{
	config.width = 870; //宽度      
	config.height = 400; //高度     
	//下面的是工具条的定义，不用的删除，用的留下。  []里在工具栏上显示一块， "/" 换行    "-"代表  "|" d
	config.toolbar_A =
		[
			['Source'],
//			['Cut','Copy','Paste','PasteText','PasteFromWord'],
			['Bold','Underline'],
//			['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
			['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
//			'/',
			['Styles','Format','Font','FontSize'],
			['TextColor','BGColor'],
			['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
		];
	config.toolbar = 'A';
	config.language = 'zh-cn';
	
	
	
	
};

样式：

二：ckeditor_config_huifu.js 代码

CKEDITOR.editorConfig = function( config )
{
	config.language = 'zh-cn';
	config.toolbar_A =
		[
			['Source'],
			['Cut','Copy','Paste','PasteText','PasteFromWord'],
			['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],
			['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
			['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
			'/',
			['Styles','Format','Font','FontSize'],
			['TextColor','BGColor'],
			['Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],
		];
	config.toolbar = 'A';
	config.uiColor = '#BFEFFF'; //背景颜色     
	config.width = 700; //宽度      
	config.height = 180; //高度     
	config.skin='kama';      //编辑器主题选择
	//工具栏      
	config.toolbar =      
	[      
	    ['Source','Bold','Italic'],      
	   ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],    
	    ['Smiley'],       
	    ['Styles','Font','FontSize'],      
	    ['TextColor'],      
	    ['Undo','Redo'],
	    ['Image','Flash']
	     
	];    
	
	
};

样式: