为WordPress添加源代码高亮显示插件

写博一小段时间，发现有好一些代码块要做高亮修饰处理，每次都自己手工逐个关键字做做颜色设置比较麻烦，于是想到WordPress这么好的博客系统有很多人都给他做了插件，有没有自动做代码高亮作色的插件呢？想到这儿就google了一下，发现好一些，口碑比较好的有 CoolCode, deans_code_highlighter, highlight-source-pro,他们都可以对一些常规编程语言(比如php, C++, java, sql)的源代码做作色处理，于是将他们下载下来上传到服务器上分别做结果测试。

首先试验CoolCode 他使用了自己扩展的coolcode标签

<coolcode lang="代码的语言">
要加高亮的代码
</coolcode>

的方式做显示控制，不过试验了一下，发现他不总是起作用，有时有高亮出来，显示的很好看，还有代码的行号显示，不过有时又不显示高亮作色出来（我的人品问题?),于是放弃使用。

然后试验 deans_code_highlighter，他是对pre标签做了扩展，添加了 lang 属性

<pre lang="代码的语言">
要加高亮的代码
</pre>

就可以了，不过尝试了很多次没有一次能够成功的将源代码高亮显示出来（还是人品问题?)

最后测试了出现时间还算新的 highlight-source-pro，他的使用的规则同 deans_code_highlighter，于是前面做的测试代码不做任何修改来测试highlight-source-pro，喔，那些在deans_code_highlighter中没有反应的代码终于显示出来了，虽然感觉上没有 coolcode 好看，不过在试验了多次不同组合方式的显示后，他总是能够正常工作(标签<pre> 和 </pre> 不能在同一行出现,要不然会有问题)，于是就用他了。
SQL的代码

<pre lang="sql">
 SELECT * FROM TEST;
</pre>

显示结果

  1.  SELECT * FROM TEST;

PHP的代码

<pre lang="php">
  function getMax($v0, $v1) {
      return $v0>$v1?$v0:$v1;
  }
</pre>

显示结果

  1.   function getMax($v0, $v1) {
  2.       return $v0>$v1?$v0:$v1;
  3.   }

Popularity: 3% [?]

Related

Tags：, , , , .
July 11, 2008 | Filed Under Uncategorized 

Comments

4 Responses to “为WordPress添加源代码高亮显示插件”

  1. 半瓶墨水 on July 25th, 2008 12:22 am

    不用这么麻烦，试试代码发芽网( http://www.fayaa.com/code/ )，30多个高亮主题，保证好用
    看看效果：http://www.2maomao.com/blog/code-fayaa-update-20080724/

    [Reply]

    sunny Reply:
    July 25th, 2008 at 1:08 am

    不过拷贝过去再粘贴回来也麻烦啊.
    现在习惯了在博客的 pre 标签中使用 lang=”xxx” 的方式了.

    [Reply]

  2. 半瓶墨水 on July 25th, 2008 2:57 pm

    呵呵效果好啊，高亮主题多:D

    [Reply]

  3. httpcn on September 10th, 2009 10:08 am

    为什么我的插件不能用呢？
    wordpress2.8.4代码高亮插件不能用，代码还是不能高亮显示

    问题补充：wp-syntax　coolcode　highlight-source-pro　任何一款都不能显示出来．我是在wordpress的后台用它默认的编辑器．

    结果还是按源码输出，似乎不起作用．

    [Reply]