我写过《WordPress编辑器加代码高亮功能》谈了一下添加有添加代码按钮的插件，以及适合插件使用的高亮语法正则表达式。然后有写过一篇《wordpress代码高亮编辑器ck-and-syntaxhighlighter》推荐一个集编辑器和代码高亮功能的插件，前两天，我有写了这样一篇文章《WordPress编辑器及代码高亮按钮更新》，虽然这篇文章只是简单的更新了一下升级之后的编辑器，但我却把最简单的原理用最通俗的说法写了出来。

除去 CK-and-Syntaxhighlighter 这个插件先不说，我来说一下我制作的 CKeditor for wordpress 。

我制作的 CKeditor for wordpress 只是集成多了各按钮，用于添加代码，添加高亮代码的正则表达式使用 SyntaxHighlighter 高亮核心的表达式，如下：

<pre class="brush:code">
代码
</pre>

而这个表达式要实现代码高亮，则必须借用其他 wordpress 代码高亮插件，并且这个代码高亮插件的表示语法是以上正则表达语法。

我现在所了解的符合这个语法的代码高亮插件有三个（如果还有多的，请大家留言告诉我），分别是 Syntax Highlighter and Code Colorizer for WordPress 、Syntax Highlighter ComPress 以及 syntax-highlighter-optimized （点击名称链接到下载页面）

Highlighter and Code Colorizer for WordPress 是基于 SyntaxHighlighter 2.1.364 核心高亮库制作，复制代码的时候会复制行号，右上角有控制按钮，如需不用无行号代码课程按钮下手，支持自动换行，但核心代码过久，渲染速度慢。不支持皮肤换色。如图所示（图中代码为GTK图形界面代码，故无太多高亮之处）。

Syntax Highlighter ComPress 是基于 SyntaxHighlighter 3.0.83.1 核心高亮库，对代码高亮的渲染更加智能化，方便化；后台可控制多款高亮皮肤显示。复制代码时不会复制行号，右上角的 “？” 只是会弹出版权信息。但是，它却无法自动换行，当代码过长时，会出现滚动条过长，如下图所示。

syntax-highlighter-optimized 是作者 Nxun 通过修改 Highlighter and Code Colorizer for WordPress 而成，使之支持最新的 SyntaxHighlighter 3.0.83.1 核心高亮库。支持自动换行，复制不会选择行号，右上角无任何按钮，据说高亮皮肤有两套，但是没有后台配置面板，无从得知如何控制皮肤颜色。如下图所示。

知道了以上各代码高亮插件的优缺点，一定有属于合适你的代码高亮插件。本人现已更换为 syntax-highlighter-optimized ，感谢作者的辛勤劳作，至于安装方法，syntax-highlighter-optimized 必须到 这里 下载，希望作者能够把他弄到后台搜索库就可以安装，其他的插件，通过后台即可安装。

最后，还是谈一下最近兴起的编辑器及代码高亮插件：CK-and-Syntaxhighlighter ，这个插件的工作原理是只有你在使用代码高亮的时候，才会插入代码高亮的字段，也就是说，这段代码高亮的 js 调用库设置在文章内容上，而不是在文件的头顶固定位置。虽然他有很多皮肤可以更换，但是这种更换只对新建文章，对原来已经设置好的高亮显示不生效。这样子虽然减少了其他文章读取不必要的 js 文件所需的时间，但是这样却不利于同意代码高亮的风格。

该插件高亮的时候无法自动换行（说这么多，其实我个人最看好自动换行，毕竟又要上写，又要左右拖动浏览器看，我感觉不是很好），并且该插件编辑器集成的插入按钮，光标在代码处点击插入代码按钮并不会把该处高亮代码返回到代码插入框（我集成按钮的那个插件支持这个功能）。若该插件作者像这方面做得越来越好，我会考虑使用 CK-and-Syntaxhighlighter，毕竟他一个插件解决了我需要修改编辑器加入按钮，以及再多安装一个代码高亮插件的麻烦步骤，而且高亮效果达到我的要求。

本文结束时，我已经将自己的网站插件更新，代码高亮方式使用我所制作的加入了插入代码按钮的 CKeditor for wordpress 以及 syntax-highlighter-optimized 用来驱动代码高亮。也希望 CK-and-Syntaxhighlighter 能够越做越好。