壞蛋的部落格

#include <stdio.h>
int main() {
    printf("hello world");
}

很美的 Code HighLight 對吧 ^^

其實 WordPress 官方網站那兒有收集很多關於程式碼HighLight 的外掛 , 但我比較之後覺得 WP-CodeBox 比較漂亮 , 但這個外掛如同其他的同類外掛都有一個問題 , 那就是會因為編輯器自動修改程式碼的一些特殊字串之後 , 導致顯示失敗 , 例如程式碼中有雙引號 , 大於及小於的符號就會有問題 , 但我稍微看了一下這個外掛的原始碼 , 我發現改一行就好了 , 提供心得給大家試試看

WP-CodeBox 安裝方法

1. 先到網址 http://wordpress.org/extend/plugins/wp-codebox/ 去下載最新版 , 然後如同安裝其他 Plugin 一樣解開該壓縮檔後 , 放到 WordPress 的 wp-content/plugins 目錄下
2. 在 WordPress 的管理畫面去啟動該外掛即可

修正 WP-CodeBox 問題

1.  用文字編輯器打開 /wp-content/plugins/wp-codebox/main.php
2. 找到一行 $code = wp_codebox_code_trim($match[5])
3. 更改為 $code = wp_codebox_code_trim( html_entity_decode( $match[5] , ENT_QUOTES ) );

OK , 大功告成 ,  這樣就不必擔心編輯器自動改 HTML 的困擾問題了 , 但我並不知道我這樣改會出甚麼問題就是了(哈) , 下面是一些程式碼顯示出來的結果

1
2
3
4
5
6
7
8

<?php
	class Hello{
		function __construct() {
			echo "Hello";
		}
	}
	$a = new Hello();
?>

1
2
3
4
5
6

public class HelloWorld {
    static public void Main() {
        Console.WriteLine("Hello World");
    }
  }
}

使用方法介紹

你的程式碼必須放在 <pre> 標籤內 , 並且要設定 <pre> 的一些屬性 , 如

<pre lang="語言" line="開始行號" colla="是否展開程式碼">你的程式碼</pre> 如下範例

1
2
3
4
5

<pre lang="php" colla="+">
<?php
echo "hello world";
?>
</pre>

當然還有其他的屬性可以用 , 以下是屬性介紹

• lang : 你的程式碼是甚麼語言寫的 , 例如 java , php , csharp(c#) , cpp(c++)
• colla : 是否要展開程式碼 , 這個選項是非必需的 , 預設是 – (減號) , 如果一開始就要展開就是寫 + (加號)
• line : 可以顯示行號 , 這個選項是非必需的 , 如果 line 填 1 , 就從第一行開始顯示 , 也可以填 10 就代表第 10 行開始顯示
• file : 可以顯示某個檔案的程式碼

官方網站有更多的範例講解 , 有興趣的可以去看看喔 , 網址是 http://www.ericbess.com/ericblog/2008/03/03/wp-codebox