kindeditor 加载 html,为kindeditor编辑器添加“引用”(blockquote)标签
相信引用
标签定义块引用,这个功能大家不陌生吧,很多用过论坛,用其他的编辑器的人很多时候多用过引用
这个功能。而且所有主流的浏览器均支持
标签。但是kindeditor编辑器不知道为什么就是不加入这个功能,其实kindeditor要加入这个功能还是很简单的,写入插件即可。
这个是测试引用blockquote标签
blockquote标签应该对于很多人来说是一个很常用的功能,用起来也是比较方便的。
PS:其实这个我是为了emlog中kindeditor编辑器写的,方便博客写文章的人士。[break]
kindeditor添加自定义插件,添加“blockquote”插件。
修改好的源码下载地址:百度网盘(editor/kindeditor.js文件没有修改需要自己修改)
by 2013-12-25 更新支持kindeditor 4.1.10版本(升级到1.1版本)
1、更新引用内容为空时插入提示;
2、更新引用插入后在编辑器中显示效果;
修改步骤:
1、添加plugins/bockquote/bockquote.js文件。(你没看错,文件夹名称少了个L,稍微做个广告不介意吧!)
/*******************************************************************************
* bockquote - KindEditor二次开发
*
* @author Star Yu
* @site http://www.myxzy.com/
*******************************************************************************/
KindEditor.plugin('bockquote', function(K) {
var self = this, name = 'bockquote';
self.clickToolbar(name, function() {
var lang = self.lang(name + '.'),
html = ['
','',''].join(''),
dialog = self.createDialog({
name : name,
width : 450,
title : self.lang(name),
body : html,
yesBtn : {
name : self.lang('yes'),
click : function(e) {
var type = textarea.val();
html ='
' + K.escape(type) + '
';
if (K.trim(type) === '') {
alert(lang.pleaseInput);
textarea[0].focus();
return;
}
self.insertHtml(html).hideDialog().focus();
}
}
}),
textarea = K('textarea', dialog.div);
textarea[0].focus();
});
});
2、添加plugins/bockquote/bockquote.css文件,用于编辑器显示效果。
blockquote {
border: 0;
background-color:rgb(245,245,245);
border-left: 3px solid rgb(0, 225, 225);
margin-left: 2em;
padding: 0.5em;
font-size: 110%;
display: block;
font-family: "Consolas", "Monaco", "Bitstream Vera Sans Mono", "Courier New", Courier, monospace;
margin: 1em 0px;
white-space: pre;
}
blockquote {
width: 630px;
margin: 1em auto;
padding: 1em;
white-space: pre-wrap;
}
3、定义语言,修改lang/zh_CN.js文件。添加以下代码。
bockquote : '插入引用',
'bockquote.pleaseInput' : '请输入引用文本。',
4、修改themes/default/default.png图片和default.css文件
这个图片我已经修改好了,会的人可以自己用photoshop修改,是图片的最后一个图标。
default.css文件添加如下代码
.ke-icon-bockquote {
background-position: 0px -1248px;
width: 16px;
height: 16px;
}
5、添加调用编辑器时items数组里添加bockquote插件
items : ['bockquote'],
cssPath :[ './editor/plugins/bockquote/bockquote.css'],
by 2013-05-10(发布1.0版本)
1、添加plugins/bockquote/bockquote.js文件。
KindEditor.plugin('bockquote', function(K) {
var self = this, name = 'bockquote';
self.clickToolbar(name, function() {
var lang = self.lang(name + '.'),
html = ['
','',
'
'].join(''),
dialog = self.createDialog({
name : name,
width : 450,
title : self.lang(name),
body : html,
yesBtn : {
name : self.lang('yes'),
click : function(e) {
var type = textarea.val();
html = '
' + K.escape(type) + '
';
self.insertHtml(html).hideDialog().focus();
}
}
}),
textarea = K('textarea', dialog.div);
textarea[0].focus();
});
});2、定义语言,修改lang/zh_CN.js文件。添加以下代码。
bockquote:'插入引用',
3、修改themes/default/default.png图片和default.css文件
这个图片我已经修改好了,会的人可以自己用photoshop修改,是图片的最后一个图标。
default.css文件添加如下代码
.ke-icon-bockquote {
background-position: 0px -1248px;
width: 16px;
height: 16px;
} 4、添加调用编辑器时items数组里添加bockquote插件
items : ['bockquote']
kindeditor 加载 html,为kindeditor编辑器添加“引用”(blockquote)标签相关推荐
- 离线GoogleMapAPIV3加载本地谷歌地图并添加标注
利用离线GoogleMapAPIV3加载本地谷歌地图并添加标注 一.准备工作 下载GoogleMapAPIV3.rar. 二.下载地图 首先通过水经注下载器把谷歌卫星地图下载下来. 三.地图引擎部署 ...
- Altium Designer PCB加载封装和向导封装,将IPC封装、加载封装和向导封装添加到原理图里、制作集成库
文章目录 1.Altium Designer PCB加载封装和向导封装 1.1加载封装流程 1.2向导封装流程 2.将IPC封装.加载封装和向导封装添加到原理图里 2.1将IPC封装添加到原理图里 2 ...
- 百度地图调用加载显示Marker,并添加点击事件
百度地图调用加载显示Marker,并添加点击事件 注册百度开发者账号,申请应用AK 百度地图开发平台官网 点击右上角控制台,选择创建应用 创建应用,勾选浏览器端,白名单填写* 注:如上线更改为公网IP ...
- Bootstrap tab页签刷新加载不显示,只有点击其他标签后第一个才显示
Bootstrap tab页签刷新加载不显示,只有点击其他标签后第一个才显示 解决方法: 在tab-content里面的tab-pane中添加active <!-- 导航区 --> < ...
- 类的加载流程、反射、直接引用和符号引用
类加载流程 一个类被加载到虚拟机内存中需要经历几个过程:加载.连接.初始化.其中连接分为三个步骤:验证.准备.解析,下面一个一个说,这个几个阶段虚拟机都干了什么. 总览图 类加载过程总览图如下图: 加 ...
- UE5热更新(通过Pak包加载关卡资源,并添加到流关卡)
请先阅读我上一篇文章)UE5热更新(Pak包的Cook,打包,加载,踩过的一些坑 ** 老规矩,还是先说踩过的坑.** 加载关卡和加载其他蓝图资源有一些不同.加载其他蓝图资源,我们要先创建一个新的FP ...
- 页面加载完时再动态添加脚步
//页面加载时不存在,加载完时再添加 function loadScript(url) {//外部文件var script = document.createElement("script& ...
- java 动态加载控件_JS动态添加节点后渲染为EasyUI控件,EasyUI动态渲染解析解决方案...
这是个小菜在实际工作中遇到的问题,相信很多EasyUI新手很可能也遇到这样的问题,因此小菜觉得有必要拿出来分享一下. 这个问题要从EasyUI的datebox组件说起,小菜用这个组件的时候,发现用$( ...
- arcgis10.0及以上版本,使用arcpy加载在arctoolbox中批量添加同一图层
代码: #coding=gbk #author:杨勇 #qq:1874445373#'''此脚本会报错,但是会正确的执行添加图层的操作. #可以添加.lyr .shp geodatabase 唯独不能 ...
- 未能加载文件或程序集_完美解决未能正确加载Visual C++资源编辑器包问题
问题:在使用VS2010过程中,出现未能正确加载"Visual C++ Resource Editor Package"的错误提示,同时工程的资源文件不能打开,出现加载失败. 原因 ...
最新文章
- Tab Bar Animation
- 终于把时间序列分析的关键点全讲清楚了!
- Hibernate一级缓存常用API
- php函数删除非空目录,删除文件夹(非空目录)及其中所有文件的思路及源代码
- microbit编程_使用图形化编程实现主控板与手机蓝牙通讯(2019.3.25)
- 即将步入2020年,程序员如何在新的一年更进一步?你需要这样做
- leetcood学习笔记-112-路径总和
- 【JVM】CMS垃圾回收器(不推荐使用的垃圾回收器)
- git 修改密码_在windows中利用gitblit搭建git服务端
- wincc控件包下载_WinCC中使用控件.pdf
- C/C++面试宝典2020版(最新版)
- 3月28日服务器维护,4月28日服务器例行维护公告
- QQ魔法卡片辅助工具外挂silverlight版
- EXCEL 2016 冻结窗口(首行首列,多行多列)
- 游戏3C之二——镜头
- 你知不知道,天空没有想象中蓝
- 基于IntelliJ Idea的Scala开发demo一Spark开发demo
- Compose学习笔记1-compose、state、flow、remember
- 秒杀小程序 php后台,基于ThinkPhp6.0+Vue 开发实现微信小程序、公众号、商城、拼团、秒杀、后台管理等功能...
- B. Lorry (贪心)