程序员人生 网站导航

phpcms编辑器添加一键排版控件

栏目:随笔时间:2015-11-17 23:16:57
CKEditor添加一键排版插件实例
大家都知道phpcms也是ckeditor编辑器,那么如果增加这个一键排版这个牛逼功能呢
增加好了后,效果图是这样的


废话不多说,直接说步骤
第一步:config.js中statics\js\ckeditor\config.js中注册autoformat控件
  1. config.extraPlugins = 'capture,videoforpc,flashplayer,autoformat'

第二步,在statics\js\ckeditor\plugins 新建文件夹autoformat

第三步,
statics\js\ckeditor\plugins\autoformat新建文件plugin.js
写入如下内容
  1. /* 
  2. Copyright (c) 2015-11-17, 程序员人生 温良顺 
  3. http://www.wfuyu.com 
  4. */ 
  5. (function() { 
  6.     CKEDITOR.plugins.add('autoformat', { 
  7.         requires: ['styles''button'], 
  8.         init: function(a) { 
  9.             a.addCommand('autoformat', CKEDITOR.plugins.autoformat.commands.autoformat); 
  10.             a.ui.addButton('autoformat', { 
  11.                 label: "清除格式,一键排版"
  12.                 command: 'autoformat'
  13.                 icon: this.path + "autoformat.gif"//这个autoformat.gif是你的插件图标,放在同目录下 
  14.             }); 
  15.         } 
  16.     }); 
  17.     CKEDITOR.plugins.autoformat = { 
  18.         commands: { 
  19.             autoformat: { 
  20.                 exec: function(a) { 
  21.                     var _html = a.getData(); 
  22.                     //清除样式代码 
  23.                     _html = _html.replace(/<div/ig, '<p'); 
  24.                     _html = _html.replace(/<\/div>/ig, '</p>'); 
  25.                     _html = _html.replace(/<strong[^>]*>/ig, ''); 
  26.                     _html = _html.replace(/<\/strong>/ig, ''); 
  27.                     _html = _html.replace(/<em[^>]*>/ig, ''); 
  28.                     _html = _html.replace(/<\/em>/ig, ''); 
  29.                     _html = _html.replace(/<u[^>]*>/ig, ''); 
  30.                     _html = _html.replace(/<\/u>/, ''); 
  31.                     _html = _html.replace(/<li[^>]*>/ig, ''); 
  32.                     _html = _html.replace(/<\/li>/ig, ''); 
  33.                     _html = _html.replace(/<span[^>]*>/ig, ''); 
  34.                     _html = _html.replace(/<\/span>/ig, ''); 
  35.                     _html = _html.replace(/&nbsp;/ig, ''); 
  36.                     _html = _html.replace(/ /ig, ''); 
  37.                     _html = _html.replace(/<p><\/p>/ig, ''); 
  38.                     _html = _html.replace(/<a/ig, '<a rel="nofollow"'); 
  39.                      
  40.                      
  41.                     //将p标签替换成<br /> 
  42.                     _html = _html.replace(/<p[^>]*>/ig,''); 
  43.                     _html = _html.replace(/<\/p>/ig,'<br />'); 
  44.                     _html = _html.replace(/<br \/><br \/>/ig,'<br />'); 
  45.                     _html = _html.replace(/[\n]/ig, ''); 
  46.                      
  47.                     //按<br />分组,将换行<br>全部替换成p标签 
  48.                      bb = _html.split("<br />"); 
  49.                      aa=''
  50.                     for(var i=0;i<bb.length;i++){ 
  51.                        aa =aa+ '<p>'+bb[i]+'</p>'
  52.                       } 
  53.                      
  54.                     //首行缩进 
  55.                      _html = aa.replace(/<p[^>]*>/ig, '<p>  '); 
  56.                      _html = _html.replace(/<p>  <\/p>/ig,''); 
  57.                      _html = _html.replace(/<p><\/p>/ig,''); 
  58.  
  59.                     //在这里执行你将_html中的空行替换掉的操作 
  60.                        a.setData(_html); 
  61.                 } 
  62.             } 
  63.         } 
  64.     }; 
  65. })(); 


写到这里,就完成啦,完成了CKEditor添加一键排版插件

但是,到这里再phpcms里面,还是不能直接用的,在别的系统里面是可以的。因为phpcms的编辑器控件是需要单独选择的,还需要修改phpcms文件
 
打开phpcms/libs/classes/form.class.php
搜索['Maximize'] 在它的后面加上 ['autoformat'],就可以了

这样phpcms编辑器添加一键排版控件就完成啦,大家有什么疑问,欢迎留言,本文是站长手写代码,转载请说明出处,本文来自程序员人生
------分隔线----------------------------
------分隔线----------------------------

最新技术推荐