当前位置: 代码迷 >> Web前端 >> CKEditor应用笔记
  详细解决方案

CKEditor应用笔记

热度:167   发布时间:2012-09-08 10:48:07.0
CKEditor使用笔记
CKEditor的使用。

1)ClassPath中添加如下jar文件
<dependency>
	<groupId>com.ckeditor</groupId>
	<artifactId>ckeditor-java-core</artifactId>
	<version>3.5.3</version>
</dependency>


2)讲附件中的压缩包解压以后COPY到WebRoot目录

3)JSP 例子
<%@ page language="java"%>
<%@ page contentType="text/html; charset=UTF-8"%>
<%@ page import="java.util.*"%>
<%@ page isELIgnored="false"%>
<%@ taglib uri="http://ckeditor.com" prefix="ckeditor"%>

<html>
	<body>
		<form action="" method="post">
			<label for="editor">
				编辑区
			</label>
			<textarea rows="10" cols="80" name="editor" id="editor"></textarea>
		</form>
		<ckeditor:replace replace="editor" basePath="ckeditor/" />
	</body>
</html>


4) 修改主要的配置文件 config.js
CKEDITOR.editorConfig = function( config )
{
	// 菜单语言 (不指定时自动判断)
	config.language = 'zh-cn';

	// 宽度 (可以指定像素或百分比)
	config.width = '100%';

	// 高度 (可以指定像素或百分比)
	//config.height = '600px';

	// 皮肤设置
	config.skin = 'office2003';	// 可选项 'office2003' 'V2' 'kama'

	// 禁止调整大小
	config.resize_enabled = false;

	// 不显示网页元素名称
	config.removePlugins = 'elementspath';

	// 工具栏
	config.toolbar = 'Customer'; // 可选项 'Default' 'Basic' 'Customer'(自定义)

	config.toolbar_Customer = [
   		['Source','-','Save','NewPage','Preview','-','Templates'],
   		['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'],
   		['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],
   		['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'],
   		'/',
   		['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']
   	];

	// 工具类是否可收缩
	config.toolbarCanCollapse = true;

	// 工具类是否默认为展开状态
	config.toolbarStartupExpanded = true;

	// ENTER & Shift+ENTER行为
	config.enterMode = CKEDITOR.ENTER_BR;	// 可选项 CKEDITOR.ENTER_P | CKEDITOR.ENTER_BR | CKEDITOR.ENTER_DIV
	config.shiftEnterMode = CKEDITOR.ENTER_P;

	// 字体设置
	config.font_names = '宋体;黑体;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana';

	// 表情设置
	//config.smiley_path = 'ckeditor/images/smileys/';
	//config.smiley_images = ['1.gif','2.gif','3.gif'];
	//config.smiley_columns = 6;

	// 是否生成完整的页面(包含 html body 标签)
	config.fullPage = false;
};
  相关解决方案