wordpress下kindeditor代码高亮bug解决办法

时间：2022-06-25 19:03:46 编辑：袖梨来源：一聚教程网

我整理了一下用法，供大家参考。

前台页面先加载插件脚本和样式：

代码如下	复制代码

后台编辑器声明的时候加上插件样式，缺省这个参数，编辑器中插入代码跟普通文字一样，并且再次编辑的时候被隐藏了，所以这一步很关键。

代码如下	复制代码
var editor = KindEditor.create('textarea.editor', { cssPath : ['[kePath]/plugins/code/prettify.css'] });

按上面的方法配置代码高亮是可以的，如果在wordpress后台开启kindeditor代码高亮，那么你发布的代码，就可以使用google代码高亮样式了，但是使用中发现个bug，就是只有在页面完全载入后才会高亮代码，在此之前是一片灰，有时个别外链的图片速度很慢，那么代码长时间处于灰色的“不可读”状态。

原因分析：

由于使用了window.onload，所以只有在页面完全载入的时候才会执行，包括图片文件的下载，而我们的网站使用的大量第三方资源，例如gravatar的头像，百度分享，多说评论什么的，说不定什么时候它们抽个风（gravatar的头像速度超慢），那么prettyPrint就一直无法执行，代码也就一片灰。

修改方法：

打开/wp-content/plugins/kindeditor-for-wordpress/kindeditor-class.php文件，找到：

代码如下

复制代码

window.onload = function(){
prettyPrint();
}

修改为：

$(function(){
prettyPrint();
})

保存退出，打开/wp-content/plugins/kindeditor-for-wordpress/kindeditor.php文件，找到：

代码如下

复制代码

add_action('wp_enqueue_scripts', array(&$kindeditor, 'add_head_script'));

修改为：

add_action('wp_footer', array(&$kindeditor, 'add_head_script'));

把 Kindeditor 的高亮代码 js 注册在底部（注意：不一定要在wp_footer，你可以根据实际情况自己修改，总之在引入 jQuery 之后就好了），保存。

推荐专题

最新下载

热门教程

wordpress下kindeditor代码高亮bug解决办法

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程