CKEditor添加一键排版插件实例,
大家都知道phpcms也是ckeditor编辑器,那么如果增加这个一键排版这个牛逼功能呢
增加好了后,效果图是这样的
废话不多说,直接说步骤
第一步:config.js中statics\js\ckeditor\config.js中注册autoformat控件
config.extraPlugins = 'capture,videoforpc,flashplayer,autoformat';
第二步,在statics\js\ckeditor\plugins 新建文件夹autoformat
第三步,在statics\js\ckeditor\plugins\autoformat新建文件plugin.js
写入如下内容
1 (function() { 2 CKEDITOR.plugins.add('autoformat', { 3 requires: ['styles', 'button'], 4 init: function(a) { 5 a.addCommand('autoformat', CKEDITOR.plugins.autoformat.commands.autoformat); 6 a.ui.addButton('autoformat', { 7 label: "清除格式,一键排版", 8 command: 'autoformat', 9 //这个autoformat.gif是你的插件图标,放在同目录下 10 icon: this.path + "autoformat.gif" 11 }); 12 } 13 }); 14 CKEDITOR.plugins.autoformat = { 15 commands: { 16 autoformat: { 17 exec: function(a) { 18 var _html = a.getData(); 19 //清除样式代码 20 _html = _html.replace(/<div/ig, '<p'); 21 _html = _html.replace(/<\/div>/ig, '</p>'); 22 _html = _html.replace(/<strong[^>]*>/ig, ''); 23 _html = _html.replace(/<\/strong>/ig, ''); 24 _html = _html.replace(/<em[^>]*>/ig, ''); 25 _html = _html.replace(/<\/em>/ig, ''); 26 _html = _html.replace(/<u[^>]*>/ig, ''); 27 _html = _html.replace(/<\/u>/, ''); 28 _html = _html.replace(/<li[^>]*>/ig, ''); 29 _html = _html.replace(/<\/li>/ig, ''); 30 _html = _html.replace(/<span[^>]*>/ig, ''); 31 _html = _html.replace(/<\/span>/ig, ''); 32 _html = _html.replace(/ /ig, ''); 33 _html = _html.replace(/ /ig, ''); 34 _html = _html.replace(/<p><\/p>/ig, ''); 35 _html = _html.replace(/<a/ig, '<a rel="nofollow"'); 36 37 38 //将p标签替换成<br /> 39 _html = _html.replace(/<p[^>]*>/ig, ''); 40 _html = _html.replace(/<\/p>/ig, '<br />'); 41 _html = _html.replace(/<br \/><br \/>/ig, '<br />'); 42 _html = _html.replace(/[\n]/ig, ''); 43 44 //按<br />分组,将换行<br>全部替换成p标签 45 bb = _html.split("<br />"); 46 aa = ''; 47 for (var i = 0; i < bb.length; i++) { 48 aa = aa + '<p>' + bb[i] + '</p>'; 49 } 50 51 //首行缩进 52 _html = aa.replace(/<p[^>]*>/ig, '<p> '); 53 _html = _html.replace(/<p> <\/p>/ig, ''); 54 _html = _html.replace(/<p><\/p>/ig, ''); 55 56 //在这里执行你将_html中的空行替换掉的操作 57 a.setData(_html); 58 } 59 } 60 } 61 }; 62 })();
写到这里,就完成啦,完成了CKEditor添加一键排版插件
但是,到这里再phpcms里面,还是不能直接用的,在别的系统里面是可以的。因为phpcms的编辑器控件是需要单独选择的,还需要修改phpcms文件
打开phpcms/libs/classes/form.class.php
搜索['Maximize'] 在它的后面加上 ['autoformat'],就可以了。
转自:http://www.wfuyu.com/biji/25066.html
原文是程序员人生。