CKEditor 4.x 部署和配置方法
把下载下来的CKEditor解压到自己设定的网站目录下,一定要注意调用的路径问题!
在html的head中引入以下文件:
<script type="text/javascript" src="ckeditor/ckeditor.js"></script> <script type="text/javascript" src="ckeditor/config.js"></script>
有以下几种方法可实现CKEditor编辑器的调用:
一:通过设置class样式
<textarea class="ckeditor" name="editor1"></textarea>
二:使用JS代码
$(document).ready(function(){ CKEDITOR.replace('entity_content'); //entity_content为textarea元素ID });
三:使用jquery
使用jquery之前一定要先引入jquery文件,另外还要引入ckeditor/adapters下的一个jquery.js(两者不一样,务必要引入)
$(document).ready(function(){ $('textarea#editor1').ckeditor(); });
另外配置config.js可以满足自己的项目需求。
CKEDITOR.editorConfig = function( config ) { // Define changes to default configuration here. // For the complete reference: // http://docs.ckeditor.com/#!/api/CKEDITOR.config // The toolbar groups arrangement, optimized for a single toolbar row. config.toolbarGroups = [ { name: 'document',groups: [ 'mode', 'document', 'doctools' ] }, { name: 'clipboard',groups: [ 'clipboard', 'undo' ] }, { name: 'editing',groups: [ 'find', 'selection', 'spellchecker' ] }, { name: 'forms' }, { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] }, { name: 'paragraph',groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] }, { name: 'links' }, { name: 'insert' }, { name: 'styles' }, { name: 'colors' }, { name: 'tools' }, { name: 'others' }, { name: 'about' } ]; // The default plugins included in the basic setup define some buttons that // we don't want too have in a basic editor. We remove them here. config.removeButtons = 'Cut,Copy,Paste,Undo,Redo,Anchor,Underline,Strike,Subscript,Superscript'; // Let's have it basic on dialogs as well. config.removeDialogTabs = 'link:advanced'; };
根据需要具体配置请查阅其他资料。
(资源库 www.zyku.net)
上一篇:pre 标签内容自动换行的方法
栏 目:HTML/Xhtml
下一篇:HTML网页特殊符号代码大全
本文标题:CKEditor 4.x 部署和配置方法
本文地址:https://www.zyku.net/xhtml/75.html
您可能感兴趣的文章
- 12-20CKEditor编辑器上传图片禁止自动设置宽高的方法
- 12-01CKEditor编辑器在项目中简单的调用方法
- 06-18帝国CMS7.5版编辑器升级为CKEditor编辑器,更实用
- 08-19抖音拍卖功能使用教程
- 01-04SSCMS恢复数据库报错指定的转换无效。
- 11-24iOS15safari怎样设置无痕模式
- 01-14小米耳机air2pro怎么连接苹果手机
- 01-10学习治税-学习治税应用软件功能介绍
- 02-07opporeno5pro息屏时间调整方法
- 01-12小默相机-小默相机应用软件功能介绍
- 03-13linux mount报错:you must specify the
- 12-25Windows Server 2008 R2常规安全设置
- 01-14鹫一健康-鹫一健康应用软件功能介绍
- 04-13红魔6开启游戏增强教程
- 02-23DedeCms中复制地址推荐给QQ/MSN上的好
- 03-10帝国cms全站去版权的方法
- 10-28华为负一屏设置停车位置显示方法介绍
- 09-11小米手机远程协助功能在哪里
- 11-19autosleep导出睡眠活动记录方法介绍
- 08-04利用PS创作出一只呆萌可爱的卡通小猪
最近更新
阅读排行
猜你喜欢
- 08-16织梦DedeCMS文章防刷新增加点击数的设
- 11-14PHP报错Input variables exceeded 100
- 09-14小米平板5pro启用杜比全景声教程分享
- 08-06NotePad++ 正则表达式替换 高级用法
- 01-08vivox70Pro如何进行录屏
- 12-29作业精灵大师-作业精灵大师应用软件功
- 01-11辅警考试-辅警考试应用软件功能介绍
- 10-21魅族18x怎样开启应用锁
- 04-20一加9pro取消5G网络教程
- 01-12皮皮搞笑-皮皮搞笑应用软件功能介绍