- 综合排序
- 最热优先
- 最新优先
- 来自专栏码客
CKEditor使用
前言 本文主要使用CKEditor4版本 CKEditor4 下载地址 https://ckeditor.com/ckeditor-4/download/ 官方文档 https://ckeditor.com /docs/ckeditor4/latest/guide/dev_installation.html CKEditor5 下载地址 https://ckeditor.com/ckeditor-5/download / 官方文档 https://ckeditor.com/docs/ckeditor5/latest/installation/getting-started/quick-start.html 该编辑器有以下几种模式 /ckeditor/ckeditor.js"></script> 页面中
<textarea id="editor" rows="10" cols 'ckeditor4-vue'; Vue.use(CKEditor); 页面中 <template><ckeditor class="warp_editor3.1K20编辑于 2022-09-19来自专栏菲宇前端使用ckeditor
本文链接：https://blog.csdn.net/bbwangj/article/details/100025915 一、导入js文件 <script src="js/plugins/<em>ckeditor</em> " id="liasionContent"></textarea> 三、配置 js配置： CKEDITOR.replace( 'liasionContent' ); 配置文件config.js配置 [ CKEDITOR.SHIFT + 121 /*F10*/, 'contextMenu' ], //文本菜单 [ CKEDITOR.CTRL + 90 /*Z [ CKEDITOR.CTRL + CKEDITOR.SHIFT + 90 /*Z*/, 'redo' ], // [ CKEDITOR.CTRL + 76 / [ CKEDITOR.CTRL + 73 /*I*/, 'italic' ], //斜体 [ CKEDITOR.CTRL + 85 /*U*/, 'underline
1.7K40发布于 2019-10-22来自专栏架构师进阶Spring Boot集成CKEditor 顶
背景 项目中需要用到富文本编辑器，朋友推荐用CKEditor。CKEditor可以和Spring mvc很好的集成。 CKEditor与CKFinder学习–整合SpringMVC介绍的不错，内容很详细，可是我们用的是Spring boot，这就蛋疼了，加上CKeditor不熟悉，走了一些弯路，搞了好久，参考一些前辈的文章 index.html中引入ckeditor.js。 <script th:src="@{/<em>ckeditor</em>/<em>ckeditor</em>.js}"></script> config.js是默认导入的，参考ckeditor.js。 ? 参考 基于spring-boot的web应用，ckeditor上传文件图片文件 代码示例
2.6K30发布于 2019-08-08来自专栏葫芦python mako ckeditor 两坑
for item in items: ${HTMLParser.HTMLParser().unescape(item.comment)} % endfor 坑2：老版本的的django和ckeditor 兼容性不好，导致后台在是使用富文本编辑器类似ckeditor保存数据时会自动添加html标签，用新版本1.11以上的django和ckeditor未发现此问题。 解决方法： 修改ckeditor的config.js文件 /** * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. * For licensing, see https://ckeditor.com/legal/ckeditor-oss-license */ CKEDITOR.editorConfig = function ; // config.shiftEnterMode = CKEDITOR.ENTER_BR; // // config.uiColor = '#AADC6E';
1.1K20发布于 2019-04-17来自专栏LNMP开发那些事ckeditor5-基础使用
这里是ckeditor5系列文章的第一篇《基础使用》。 ckeditor5-基础使用 其实ckeditor是一个老项目了，但是相对于其他的编辑器，它是一直在保持更新的，目前最新的版本就是ckeditor 5，这里以经典编辑器样式（Classic Editor npm install --save @ckeditor/ckeditor5-build-classic # Or: npm install --save @ckeditor/ckeditor5-build-inline # Or: npm install --save @ckeditor/ckeditor5-build-balloon # Or: npm install --save @ckeditor/ckeditor5 title> <script src="https://cdn.<em>ckeditor</em>.com/<em>ckeditor</em>5/11.1.1/classic/<em>ckeditor</em>.js"></script> </head
4.2K20发布于 2019-07-31来自专栏Kirin博客django-富文本-ckeditor配置
django-ckeditor 安装 $ pip install django-ckeditor 注册 # settings.py ... # Application definition INSTALLED_APPS \Lib\site-packages\ckeditor\static\ckeditor\ckeditor\plugins\ 目录中，名称是 codesinppet 配置 在 settings.py 中添加自己的 ckeditor 配置，如下 # settings.py ... # ckeditor CKEDITOR_CONFIGS = { # 将这份配置命名为 my_config 'my_config 没有自带的，只需要在网上把插件下载到 ckeditor\static\ckeditor\ckeditor\plugins\ 目录中，再进行配置即可。 highlight.pack.js 就是需要引用的 js 库(可在“…\Lib\site-packages\ckeditor\static\ckeditor\ckeditor\plugins\codesnippet
2.5K20发布于 2020-05-09来自专栏python3django使用ckeditor上传图片
'ckeditor', # 富文本编辑器 'ckeditor_uploader', # 富文本编辑器上传图片模块 ... ] # 富文本编辑器ckeditor配置 CKEDITOR_CONFIGS /django_1.11.16_py3/lib/python3.5/site-packages/ckeditor/static/ckeditor/ckeditor/ 在js路径前加上域名，否则服务器会在 /ckeditor/ckeditor.js"></script> 4、在vue变量的mounted方法中加入 let vm = new Vue({ ... }, }); 5、后端设置总路由，'ckeditor_uploader.urls'中会将接收到的请求进行csrf校验免除，并限制了只有登录用户才可以上传图片，ckeditor默认应用的是django-admin /', include('ckeditor_uploader.urls')), # 为富文本编辑器添加总路由 # url(r'^ckeditor/upload/', ImageUploadView.as_view
3K10发布于 2020-01-22来自专栏华创信息技术ckeditor解决首行缩进问题
文章时间：2020年11月28日 17:17:15 解决问题：ckeditor编辑器解决首行缩进2个字符的问题，国人的习惯不能改。 打开ckeditor.js文件，使用ctrl+f进行搜索。
2.2K20编辑于 2022-05-28来自专栏LNMP开发那些事ckeditor4与vue集成
公司的项目开始使用的是ckeditor5，由于ckeditor5目前功能还不够完善，所以不得不替换成ckeditor4，以下记录一下vue-cli项目与ckeditor的集成方法。 加载ckeditor 修改vue项目中的index.html <! from 'path/to/CkeditorComponent' 添加组件： ... components: { 'ckeditor4': ckeditor4 }, ... 在模板中使用组件： <ckeditor4 v-model="content"></ckeditor4> 这样，刷新页面，ckeditor4就与vue集成好了。 相对于ckeditor5，目前ckeditor4基本包含了对于富文本编辑器的所有需求。鉴于百度ueditor已经不再维护，应该说ckeditor4还是一款非常不错的富文本编辑器。
4K30发布于 2019-07-31来自专栏菲宇flask使用富文本编辑器ckeditor
from flask_ckeditor import CKEditor app = Flask(__name__) ckeditor = CKEditor(app) 如果你使用了工厂函数，那么也可以调用 init_app()方法来进行初始化： from flask_ckeditor import CKEditor ckeditor = CKEditor() def create_app(): app = Flask(__name__) ckeditor.init_app(app) return app 引入CKEditor资源 为了使用CKEditor，我们首先要在模板中引入 提供的ckeditor.load()方法来生成引用语句： {{ ckeditor.load() }} 它默认从CDN加载资源，将配置变量CKEDITOR_SERVE_LOCAL设为True会使用扩展内置的本地资源 ')) }} 创建CKEditor文本区域 Flask-CKEditor提供了两种方式来CKEditor文本区域： 1.
4.9K30发布于 2020-03-20来自专栏技术综合django-ckeditor本地图片上传功能
django-ckeditor 默认是把本地图片上传给关闭的，需要自己手动操作开启 demo代码地址：https://github.com/klren0312/djangoCKEditor_Stu 1.安装ckeditor pip install django-ckeditor 2.在setting.py中的INSTALLED_APPS中加入两个 INSTALLED_APPS = [ 'ckeditor ', 'ckeditor_uploader' ] 3.在setting.py中设置ckeditor MEDIA_URL = "/media/" MEDIA_ROOT = os.path.join (BASE_DIR,"media") CKEDITOR_UPLOAD_PATH = "uploads/" CKEDITOR_IMAGE_BACKEND = 'pillow' 配置功能项和样式 CKEDITOR_CONFIGS = { 'default': { 'update': ['Image', 'Update', 'Table', 'HorizontalRule
1.5K20发布于 2020-08-25来自专栏袁威在django-admin中使用django-ckeditor
~ 首先安装django-ckeditor pip install django-ckeditor 其次，需要安装pillow（pillow是python的一个图形处理库，此次用到的django-ckeditor 需要依赖此库） pip install pillow 安装好后，就是要进行django的配置，大致配置步骤如下： 1.在settings.py文件中，将“ckeditor”和“ckeditor_uploader ', 'ckeditor_uploader' ] 2.在settings.py中配置“CKEDITOR_UPLOAD_PATH MEDIA_URL = '/' CKEDITOR_UPLOAD_PATH settings.py里配置“CKEDITOR_CONFIGS”的配置项 CKEDITOR_CONFIGS = { 'default': { 'toolbar': (['div 编辑的内容在前端显示的时候，需要在页面头部引入js文件 <script src="{% static '<em>ckeditor</em>/<em>ckeditor</em>/plugins/codesnippet/lib/highlight
2.1K30编辑于 2022-06-10来自专栏小狼的世界Ajax应用中CKEDITOR多实例问题的解决
著名的Fckeditor升级之后就改名叫了CKEDITOR，界面和功能有了很大的提升，所以我在最近的项目中应用CKEDITOR。 随着项目的深入，在Ajax应用较多的一个部分使用CKEDITOR时发现了问题，描述如下： 通过单击一个链接，调入需要显示的内容，其中包括一个富文本编辑器，这里使用了CKEDITOR。 出现这个问题后，分析的方向一直集中在CKEDITOR多实例的问题。因为第一次点击链接，调用内容时，已经进行了一次CKEDITOR的实例化，第二次调入时必然会与第一次的冲突。 后来google之，得到了目前可以正常解决这个问题的方法 if( CKEDITOR.instances['content'] ){ CKEDITOR.remove(CKEDITOR.instances 的官方文档和论坛中均为看到相关的说明，遗憾… Technorati 标签: Ajax,CKEDITOR,instance 参考资料： 1、CKEDITOR 2、CKEDITOR instance already
1.7K20发布于 2018-07-25来自专栏魏杰的技术专栏为CKEditor添加中文字体选项
CKEditor是一个专门使用在网页上属于开放源代码的所见即所得文字编辑器。它志于轻量化，不需要太复杂的安装步骤即可使用。 CKEditor编辑器界面中的字体选项里暂时没有中文字体。 可按如下方法添加： 打开CKEditor目录里的config.js，找到下面这段代码： CKEDITOR.editorConfig = function( config ) { … }; 在其中，
2.2K10编辑于 2022-12-23来自专栏卓越笔记django admin 使用 ckeditor 富文本编辑器
安装 django-ckeditor 库 pip install django-ckeditor pip install pillow (上传图片到伺服器裁剪用，生成浏览伺服器的缩略图) 2. settings.py ( CKEDITOR_CONFIGS 里的 awesome_ckeditor 是给 model 里面的 config_name 用的 ) INSTALLED_APPS = [ 'ckeditor ', 'ckeditor_uploader', ] # ckeditor CKEDITOR_CONFIGS = { 'awesome_ckeditor': { ' toolbar': 'full', }, } CKEDITOR_UPLOAD_PATH = 'ckeditor/' # 他的目录相对与media root 就是 media root + CKEDITOR_UPLOAD_PATH ='awesome_ckeditor'，要在 settings 里 CKEDITOR_CONFIGS 配置下找到该名称） # from ckeditor.fields import RichTextField
1.4K20编辑于 2023-02-17来自专栏卓越笔记用 django2, simpleUI, ckeditor 创建博客管理后台
* 本文代码同步更新至 https://gitee.com/yinzhuoqun/django2 * 开发环境 python 3.6.8 django 2.2.4 django-ckeditor 5.7.1
54420编辑于 2023-02-18来自专栏kifroomVue富文本编辑器-Ckeditor4
Ckeditor4的下载 link: https://ckeditor.com/ckeditor-4/download/ 下载好后解压, 打开index, 打开后就是配置界面 /static/ckeditor/ckeditor.js"></script> vue主要在index.html 需要的界面通过id引入
<textarea :id= * For licensing, see https://ckeditor.com/legal/ckeditor-oss-license */ CKEDITOR.editorConfig = function /docs/ckeditor4/latest/api/CKEDITOR_config.html // The toolbar groups arrangement, optimized for two * For licensing, see https://ckeditor.com/legal/ckeditor-oss-license */ CKEDITOR.editorConfig = function1.6K20编辑于 2023-02-27来自专栏菲宇Django添加ckeditor富文本编辑器
源码 https://github.com/django-ckeditor/django-ckeditor 通过pip安装。 pip3 install django-ckeditor pip3 install Pillow 在settings.py的INSTALLED_APPS里添加ckeditor和ckeditor_uploader INSTALLED_APPS = ( # 'ckeditor', 'ckeditor_uploader' ) 在settings.py里进行ckeditor的相关配置。 'ckeditor', # 富文本编辑器 'ckeditor_uploader', # 富文本编辑器上传图片模块 ... ] # 富文本编辑器ckeditor配置 CKEDITOR_CONFIGS /django_1.11.16_py3/lib/python3.5/site-packages/ckeditor/static/ckeditor/ckeditor/ 在js路径前加上域名，否则服务器会在
3.1K31编辑于 2022-12-21来自专栏卓越笔记Django CKEditor 给 a tag（标签）添加 target 默认值
启发文档 https://ckeditor.com/docs/ckeditor4/latest/guide/dev_disallowed_content.html CKEDITOR.on( 'dialogDefinition 在 django ckeditor 的 config.js 的代码中，我加了几个 console.log 得到结果： 就是两次 get 元素 id，得到需要的节点，再设置这个节点的默认值。 实现代码 CKEditor config.js 代码路径：.. /lib/python3.6/site-packages/ckeditor/static/ckeditor/ckeditor/config.js config.js 修改完后要重新收集静态文件部署，正式环境才能使用 /lib/python3.6/site-packages/ckeditor/static/ckeditor/ckeditor/plugins/link/dialogs/link.js 里 id 为 linkTargetType
1.8K30编辑于 2023-02-18来自专栏LNMP开发那些事概览 - 构建文档 - ckeditor5中文文档
概览 ckeditor 5构建版本是一些被准备好的富文本编辑器的集合。每一个“构建版本”提供一个包含一系列特性和一个默认配置的编辑器。 可用构建版本 下面是ckeditor 5当前可用的构建版本： Classic editor Classic editor 是大多数用户已经习惯的富文本编辑器 - 一个工具栏和一个编辑区域放在页面的某个位置 在ckeditor 5中，“盒子”编辑器的概念被修改了： 当用户向下滚动页面，工具栏现在总是可见的。 编辑器内容现在放置在页面内（并没有使用<iframe>元素） - 它现在更易于去修改样式了。 ，你应该使用ckeditor4： :需要做旧浏览器适配的时候 如果ckeditor4包含你需要的特性，但是ckeditor5还没有的时候 如果ckeditor4已经在你的应用中使用，并且你还没有准备好去用 原文地址：https://www.dnote.cn/users/ianzhi/posts/ckeditor5-builds-overview 文章版权归作者所有，转载请保留此声明。
9K30发布于 2019-07-31腾讯云开发者
