添加自定義插件
1. 添加”hello”插件
- 添加plugins/hello/hello.js文件。
KindEditor.plugin('hello', function(K) {
var editor = this, name = 'hello';
// 點擊圖標時執行
editor.clickToolbar(name, function() {
editor.insertHtml('你好');
});
});
- 定義語言，在頁面的<script>標簽里添加以下腳本。
KindEditor.lang({
hello : '你好'
});
- 定義工具欄圖標的CSS，在頁面的<style>標簽里添加以下CSS。
.ke-icon-hello {
background-image: url(../skins/default/default.gif);
background-position: 0px -672px;
width: 16px;
height: 16px;
}
- 最后調用編輯器時items數組里添加hello。
K.create('#id', {
items : ['hello']
});
完整代碼：
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Hello</title>
<style>
.ke-icon-hello {
background-image: url(../skins/default/default.gif);
background-position: 0px -672px;
width: 16px;
height: 16px;
}
</style>
<link rel="stylesheet" href="../themes/default/default.css" />
<script charset="utf-8" src="../kindeditor.js"></script>
<script charset="utf-8" src="../lang/zh_CN.js"></script>
<script>
KindEditor.lang({
hello : '你好'
});
KindEditor.ready(function(K) {
K.create('#id', {
items : ['hello']
});
});
</script>
</head>
<body>
<textarea id="editor_id" name="content" style="width:700px;height:300px;"></textarea>
</body>
</html>