跪求!CKEditor如何添加自己写的插件

http://bbs.csdn.net/topics/390187058

 第一步:config.js中

JavaScript code?
1
config.extraPlugins = '插件名称';//注册插件 


第二步:plugins文件夹下新建:插件名称 文件夹
第三步:
1:在plugins/插件名称/下新建plugin.js;
2:在plugins/插件名称/下新建 dialogs文件夹,并在其内新建 "插件名称.js"

JavaScript code?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
(function() {
    CKEDITOR.plugins.add("插件名称", {
        requires: ["dialog"],
        init: function(a) {
            a.addCommand("插件名称", new CKEDITOR.dialogCommand("插件名称"));
            a.ui.addButton("插件名称", {
                label: "插件名称",//调用dialog时显示的名称
                command: "插件名称",
                icon: this.path + "g.ico"//在toolbar中的图标
 
            });
            CKEDITOR.dialog.add("插件名称"this.path + "dialogs/插件名称.js")
 
        }
 
    })
 
})();


第四步:/plugins/插件名称/dialogs/插件名称.js 内容如下

JavaScript code?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
(function() {
    CKEDITOR.dialog.add("插件名称"
    function(a) {
        return {
            title: "插件名称",
            minWidth: "500px",
            minHeight:"500px",
            contents: [{
                id: "tab1",
                label: "",
                title: "",
                expand: true,
                width: "500px",
                height: "500px",
                padding: 0,
                elements: [{
                    type: "html",
                    style: "width:500px;height:500px",
                    html: '内容测试'
                }]
            }],
            onOk: function() {
                //点击确定按钮后的操作
                //a.insertHtml("编辑器追加内容");
            }
        }
    })
})();

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

第一步:config.js中

JavaScript code?
1
config.extraPlugins = 'clearempty';//注册插件,extraPlugins只允许出现一次,你如果之前有新增别的插件,那么用逗号分隔



第二步:plugins文件夹下新建:clearempty 文件夹
第三步:
1:在plugins/clearempty/下新建plugin.js;内容如下:

JavaScript code?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
(function() {
    CKEDITOR.plugins.add('clearempty', {
        requires: ['styles''button'],
        init: function(a) {
            a.addCommand('clearempty', CKEDITOR.plugins.clearempty.commands.clearempty);
            a.ui.addButton('clearempty', {
                label: "清除空行",
                command: 'clearempty',
                icon: this.path + "g.ico"//这个g.ico是你的插件图标,放在同目录下
            });
        }
    });
    CKEDITOR.plugins.clearempty = {
        commands: {
            clearempty: {
                exec: function(a) {
                    var _html = a.getData();
                    //在这里执行你将_html中的空行替换掉的操作
                       a.setData(_html);
                }
            }
        }
    };
})();
第四步:/plugins/插件名称/dialogs/插件名称.js 内容如下
JavaScript code?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
(function() {
    CKEDITOR.dialog.add("插件名称"
    function(a) {
        return {
            title: "插件名称",
            minWidth: "500px",
            minHeight:"500px",
            contents: [{
                id: "tab1",
                label: "",
                title: "",
                expand: true,
                width: "500px",
                height: "500px",
                padding: 0,
                elements: [{
                    type: "html",
                    style: "width:500px;height:500px",
                    html: '内容测试'
                }]
            }],
            onOk: function() {
                //点击确定按钮后的操作
                //a.insertHtml("编辑器追加内容");
            }
        }
    })
})();

posted on 2015-04-10 10:52  鬼鬼丫404  阅读(100)  评论(0编辑  收藏  举报

导航