本文档基于已经搭建好基础ckeditor的环境上。如:http://www.cnblogs.com/daxin/p/3553865.html
使用leaflet的ckeditor的google map插件;
1、下载、解压插件
下载地址:
http://ckeditor.com/addon/leaflet
下面是leaflet依赖的插件
http://ckeditor.com/addon/widgetselection
http://ckeditor.com/addon/widget
http://ckeditor.com/addon/lineutils
将以上包下载,解压到ckeditor/plugins目录下。
2、配置ckeditor/config.js
config.extraPlugins+="widgetselection,lineutils,widget,leaflet,"; config.leaflet_maps_google_api_key = 'AIzaSyA9ySM6msnGm0qQB1L1cLTMBdKEUKPySmQ';
这个google map key建议自己再申请一个哦,代码中的是原开发者的,可能不能用了。
查看一下效果:
3、在java环境中可能会遇到以下错误:
in a frame because it set 'x-frame-options' to 'deny'.
4、那么别着急,添加一下java配置代码和xml配置即可。
4.1、使用spring xml文件配置
<http> <headers> <frame-options policy="SAMEORIGIN"/><!-- 相同域名下允许加载 --> </headers> </http>
4.2、使用spring boot代码配置
@Override protected void configure(HttpSecurity http) throws Exception { //直接关闭frameOptions功能 http.headers().frameOptions().disable(); }
5、验证一下。
相关推荐
CKEditor 添加Video插件(MP4)并且兼容HTML5 Video插件 1:把video文件复制到ckeditor/... b:配置 CKEditor的(config.js) 文件,加入下面的代码,意思是引入插件 添加后面这句号加载。 config.extraPlugins = 'video';
1. 引入依赖:在Spring MVC项目中,添加CKEditor和CKFinder的库,通常是通过Maven或Gradle引入对应的jar包或NPM模块。 2. 配置CKEditor:在HTML页面中引入CKEditor,并设置其配置项,如工具栏、语言等。同时,配置...
本项目是关于如何在ASP.NET MVC3环境中配置CKEditor 4.4.0版本与CKFinder进行图片上传的详细步骤。 首先,`Global.asax`文件是ASP.NET应用程序的全局应用事件处理程序,它定义了应用程序启动、结束、请求开始等关键...
在 mydialog.js 文件中,我们可以使用 CKEDITOR.dialog.add() 方法来添加自定义窗口的配置信息,例如: ``` CKEDITOR.dialog.add('mydialog', function(editor) { return { title: '标题', minWidth: 400, ...
2. **创建文本区域**:在需要使用编辑器的地方插入一个`<textarea>`或ASP.NET环境下的`<TextBox>`控件,并为其添加`class="ckeditor"`属性,以便CKEditor能够识别并转换它。 ```html ...
CKEditor4.2只能增加flash播放格式,没有视频插件。这个插件允许插入和编辑新的HTML5<video>元素。该对话框允许指定的海报图像,尺寸(他们是根据预览自动调整)和两个源文件,这样既使用了WebM格式(Chrome...
然后,在Spring Boot的配置文件`application.yml`或`application.properties`中,我们需要配置CKFinder的相关参数,例如访问路径、存储位置、权限控制等。这可能包括: ```yaml ckfinder: base-path: /ckfinder ...
在本项目中,我们主要探讨的是如何在Spring Boot框架下构建一个完整的发帖模块,这在许多Web应用程序中是核心功能之一,特别是对于论坛、博客等互动性平台。Spring Boot以其简洁的配置、快速的开发体验和强大的依赖...
在IT行业中,Spring Boot是一个非常流行的Java开发框架,它简化了Spring应用的初始搭建以及开发过程,提供了自动配置、起步依赖等特性。本项目聚焦于将富文本编辑器集成到Spring Boot应用中,以增强用户界面的内容...
最近项目开发需要用到CKEditor在线编辑器,但发现他本身没有自带,所以需要自己手动配置插件。但网上很多配置都有问题,自己摸索了好久终于搞定。需要注意的细节有:flvPlayer文件夹的内容直接放在ckeditor文件夹...
"ckeditor4添加上传视频插件"这个主题,是关于如何在CKEditor 4中集成视频上传功能的教程。下面我们将详细探讨这一过程。 首先,视频上传功能的实现通常涉及前后端两个部分。前端部分是CKEditor 4编辑器的用户界面...
CKEditor和CKFinder是两个非常重要的Web内容编辑和管理工具,尤其在网页开发和内容管理系统中广泛应用。CKEditor3.5.2是一个成熟的富文本编辑器,而CKFinder则是一个文件管理和上传组件,它们通常一起使用,以提供一...
`addAdvice.jsp`可能用于处理用户提交的包含CKEDITOR编辑器内容的表单,比如添加建议或评论。它可能会接收编辑器内的HTML内容,保存到数据库,或者进一步处理图片URL,确保它们能在服务器上正确访问。 6. **安全与...
- 解压缩下载的文件,将CKEditor的`ckeditor`文件夹移动到你的网站根目录下。例如:`D:\Program Files\EasyPHP-DevServer-13.1VC9\data\localweb\qnshop_portals\ckeditor`。 - 对于CKFinder,将其`CKFinder`...
### ckeditor的详细配置 ckeditor是一款非常流行的富文本编辑器,它是FCKeditor的后续版本,广泛应用于网页开发中,支持多种浏览器环境。本文将详细阐述如何进行ckeditor的基本配置及高级定制,帮助开发者更好地...
**ckeditor4.2.2自定义配置** CKEditor是一款强大的富文本编辑器,广泛应用于网页内容编辑、CMS系统以及各种在线文档处理。CKEditor 4.2.2是该系列的一个较早版本,但仍然包含丰富的功能和高度的可定制性。在实际...
**ckeditor及配置方法** CKEditor是一款强大的富文本编辑器,广泛应用于网站内容管理、论坛、博客等场景,为用户提供了一种便捷的在线文本编辑体验。它支持多种语言,包括中文,且具有高度可定制性,可以满足不同...
Ajax-michaelcgood-ckeditor-spring-boot.zip,演示如何将ckeditor与spring boot结合使用的教程。,ajax代表异步javascript和xml。它是多种web技术的集合,包括html、css、json、xml和javascript。它用于创建动态网页...
.NET环境下ckeditor与ckfinder配置(附ckfinder1.x注册机)
通过安装和配置插件,我们可以扩展CKEditor的功能,比如添加视频插入能力。 1. **添加Video插件**:CKEditor允许开发者通过插件来扩展其功能。为了在CKEditor中添加Video插件,首先你需要从CKEditor的官方插件库或...