简单方便的代码高亮插件推荐（编辑方便）

一直以来都是用的wp-codebox插件用来显示代码高亮，但是这个插件的使用过于麻烦。

你是不是每次在HTML模式下插入<pre>再返回到可视化模式时，代码总会被打乱，像<>这种标签会被替换成&lt、&gt。

Laycher 我的方法就是每次都是文字图片在可视化模式下编辑成功后，再转到HTML模式下，手动插入<pre lang="css"></pre>这样的代码。然后点击发布，千万不能再转回可视化，这样的做法导致的结果就是每次文章发布后，都要 重复性检查几次，以防止出现代码错误的现象，或者文章排版问题。

这个现象不止在wp-codebox这个插件出现，比如：

SyntaxHighlighter Evolved，使用标签为语言封堵标签，比如[php]php code here[/php]，CSS语言[css]CSS code here[/css]。更多语言支持请参考官方说明。

Code Colorer，该插件使用<code>标准标签，也使用自家的<cc>非标准标签。代码格式，[cc lang="lang"]code here[/cc]或<code lang="lang">code here</cc>。

WP-Syntax,也是使用<pre>标签加上语言格式封堵代码区域，兼容性也很好。

其他的我也不多介绍，这方面的插件很多，不过它们的共同点就是总是要在HTML模式下手动输入代码，如果再转回可视化模式的话，代码就会错乱。

现在好了，发现了一个好的插件，插件名为：syntax-highlighter-with-add-button-in-editor。

现在的版本是2.0.2，该插件是基于syntax-highlighter开发的，解决了后台插入代码的繁琐性。安装这个插件后，后台编辑文章的地方，就会弹出一个syntax highlighter ++编辑框，用于插入代码，具体如下图所示：

在这个编辑框中输入你要插入的代码，然后选择你的代码的语言，点OK，就可以直接插入上方的编辑框中。不用再转到HTML模式下编写了！

插入效果如下（由于换用wp-codebox++，所以只能图片的形式。）：

插件下载地址：syntax-highlighter-with-add-button-in-editor