建站帮助

诚信合作, 高质专业!

自定义Phpcms V9编辑器做到几个人性化功能

2013-11-04 20:57:29 浏览 我要评论

众所周知,Phpcms V9后台使用的编辑器是CKEditor,不少朋友吐槽,比如:不能引用原生代码(编辑器里边的代码会自动执行)、在段落标记后面会产生换行、tab和多余的空格,今天在这里,CMSYOU将与大家说说怎么去掉Phpcms V9编辑器自动产生段落冗余空格,以及怎么自定义Phpcms V9编辑器做到几个人性化功能。

当前最新的版本已经采纳了建议,在CKEditor控制文件statics/js/ckeditor/config.js,找到22行加入了下面的代码:

CKEDITOR.on( 'instanceReady', function( ev ) { with (ev.editor.dataProcessor.writer) {
setRules("p", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("h1", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("h2", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("h3", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("h4", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("h5", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("div", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("table", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("tr", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("td", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("iframe", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("li", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("ul", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); 
setRules("ol", {indent : false, breakAfterOpen : false, breakBeforeClose : false} ); } 
});

注:

indent (是否加入空白 TAB)
breakBeforeOpen (插入起始代码标签之前是否断行)
breakAfterOpen (插入起始代码标签之后是否断行)
breakBeforeClose (插入结尾代码标签之前是否断行)
breakAfterClose (插入结尾代码标签之后是否断行)

下面来具体说说今天的主题:自定义Phpcms V9编辑器人性化功能。

一、跟回Word换行(硬回车和软回车)的模式:

默认Phpcms V9里边的CKEditor预设的键入“Enter”是
标签,而“Shift + Enter”是

标签,这和Word操作恰好相反。

具体自定义方法:找到修statics/js/ckeditor/config.js,修改17行的代码:

config.enterMode = CKEDITOR.ENTER_BR; 
config.shiftEnterMode = CKEDITOR.ENTER_P;

可以自定义回来!

二、修改编辑器首行缩进:

首行自动缩进,这个功能很多朋友会喜欢。默认V9编辑器使用的p标签没有设置缩进,而又不能设置全局的text-indent属性,因为这样有些不需要的也有缩进了。

修改Phpcms编辑器首行缩进

其实可以在需要缩进的地方使用TAB键缩进。

修改方法:

打开statics/js/ckeditor/config.js,在第19行后添加:

config.tabSpaces = 4;

保存,测试下!

下一页,我们将讲到修改编辑界面的文字大小和行高、添加批量去除超链接功能、上传图片自动添加ALT属性。

我要收藏
点个赞吧

相关阅读

本月热门

精选推荐

在线客服

扫一扫,关注我们

扫一扫,关注我们