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;
};
分享到：
相关推荐
### CKEditor 学习笔记：实现自定义按钮与图片上传功能 #### 一、简介 在Web开发过程中，富文本编辑器（Rich Text Editor）是非常常见的需求之一。...希望本篇学习笔记能帮助大家更好地理解和掌握CKEditor的使用技巧。
ASP.NET 笔记之 CKEditor 的使用方法，CKEditor 是一个功能强大且灵活的富文本编辑器，广泛应用于 ASP.NET 开发中。本节笔记将详细介绍 CKEditor 的使用方法，并提供实践经验和解决方案。 一、CKEditor 的配置和...
***与CKEditor的整合使用是一组关于在***项目中引入并配置CKEditor的详细指南。CKEditor是一个流行的开源HTML富文本编辑器，它允许网站的管理员和用户在线编辑和格式化HTML内容。以下是从文档中提取的关于CKEditor在...
综上所述，CKEditor 3.2 在传智播客的课程中扮演着重要角色，帮助学员掌握富文本编辑器的使用，并将其应用于实际的Web开发场景。随着技术的发展，不断学习和适应新的编辑器版本以及相关技术是保持竞争力的关键。
.net环境下ckeditor与ckfinder学习笔记 ckeditor 3.0.1学习笔记 一.ckeditor 3.0.1精简 精简前:4.52M 精简后:853K 1.删除_samples和_source文件夹,分别为示例文件和未压缩源程序 2.删除lang文件夹下除zh-...
此外，可能还需要使用WebSockets实现实时更新，确保用户在不同设备上的笔记保持一致。 其次，用户界面的设计和实现是项目的关键部分。云笔记的前端可能采用React、Vue或Angular等现代JavaScript框架来构建，这些...
这个文件包中编写了CKEditor和CKFinder文本编辑器的使用代码，对基本的表情，图片上传，字体等配置进行了处理，该包可以直接在tomcat服务器下运行，如果看了后还不知道的话,可以边看项目边看我的博客笔记中的...
5. **笔记内容**：笔记内容可能包含富文本、图片、链接等，需要使用适当的库如TinyMCE或CKEditor来处理和显示。 6. **错误处理**：libNote应包含对API错误的处理机制，如重试、异常捕获等，确保程序的健壮性。 7. ...
它的设计目标是提供一个与CKEditor、TinyMCE等类似的编辑体验，但更加轻量级，对现代浏览器的支持更好，并且尽可能地避免引入XSS安全问题。 这个插件的亮点在于其简洁的API和易于定制的特性。开发者可以根据需要...
编辑器如CKEditor或TinyMCE允许用户以富文本形式输入留言，提高用户体验。在PHP中，编辑器的值也需要通过`$_POST`获取，并处理后再插入数据库。 7. **显示留言**：为了展示已有的留言，PHP需要从数据库中检索数据，...
与 FUEL CMS 一起使用的 CKEditor 插件以公开“锚点”功能 安装 将 CKEditor 安装的插件目录插入到 ./fuel/modules/fuel/assets/js/editors/ckeditor/plugins 笔记 在撰写本文时，“fuelimage”插件有一个会干扰该...
10. **最新版本与替代品**：FCKeditor已更名为CKEditor，并有多个版本更新，笔记可能会提及这些更新以及新版本的特性。同时，随着技术的发展，可能还提到了其他富文本编辑器的比较，如TinyMCE、Quill等。 以上是...
CKEditor 是一款广泛使用的开源富文本编辑器，以其强大的功能和易用性深受开发者喜爱。而 `drawingBoard` 插件的引入，进一步增强了其功能，使得用户可以在编辑文档时直接添加手绘图形，提升了交互性和创造性。 ###...
1. **笔记创建与编辑**: 用户可以创建新的笔记，利用内置的CKEditor进行富文本编辑，支持文本格式化、插入图片等功能。 2. **笔记存储**: 所有的笔记数据都被保存在SQLite数据库中，确保数据的安全性和持久性。 3. *...
此外，笔记还提及了商品规格和商品的关系表，以及页面内容编辑工具如KindEditor、CKEditor和FCKEditor的工作原理。这些工具在网页上以富文本编辑器的形式存在，允许用户进行图文编辑，但因基于JavaScript，可能会...
Java Web基础与实例教程的PPT，自己制作的PPT，将近400页，免费分享，童鞋们努力学习吧。
2. 数据结构设计：合理组织数据结构，例如使用JSON对象存储笔记，每个笔记包含标题、内容、创建时间等字段。 3. 数据同步：如果需要云同步，可以结合后端API，利用Ajax异步请求实现数据的上传和下载。 五、响应式...
如果说所见即所得，这不比markdown好用？... 相比于 **2.x.x** 版本，主体技术依旧是 **electron**，编辑器也还是 **ckeditor**，但添加了 **vue3**，使用 **vite** 构建，搭配了 **ts** 语言，UI使用 **element plus**