menu
2010-08-03 otaku

写在前面

用WordPress以来，一直都用CodeColorer插件用来实现代码高亮，不过一直没花时间去看说明，用起来很苦恼。所以今天决定花点时间认真学习下，并根据作者的说明总结下各个属性的作用，还添加了些例子，以后忘了理解起来也方便些。不过都是些苦力活啦。

CodeColorer

CodeColorer是一款基于GeSHi库的WordPress代码语法高亮插件。功能简单，使用方便，是一款比较轻量的插件。CodeColorer支持placeholderfor0code 和

<code lang="lang">code</code>

两种语法。这里是插件的主页，本文据此翻译修改而成。

属性说明及例子

属性列表如下,括号内是参数类型.string是字符串；integer是整数；boolean是布尔型(开关)，可接受「true” “false”, “on” “off”, 整数 1 or 0.

  • lang (string) – 代码使用的语言。
  • tab_size (integer) – 用以替换制表符的空格数，可在设置界面更改。
  • line_numbers (boolean) – 是否显示行号，可在设置界面更改。
  • first_line (integer) – 指定代码块第一行的行号
  • highlight (string) – 用于指定整行高亮的代码行行数，参数是用半角逗号分隔的数字串(如 1,5,8,9)。
  • no_links (boolean) – 当值为false时，关键字将会添加一个到官方文档的链接，可在设置界面更改。
  • lines (integer) –指定代码块显示的行数，当值设置为-1时，不出现纵向滚动条，可在设置界面更改。
  • width (integer or string) – 代码块宽度，可在设置界面更改。
  • height (integer or string) – 代码块高度，当这个高度可显示的行数比lines指定的值大才会生效，可在设置界面更改。
  • rss_width (integer or string) – 代码块在RSS输出时的宽度，可在设置界面更改。
  • theme (string) – 代码块颜色风格 (default, blackboard, dawn, mac-classic, twitlight, vibrant)，可在设置界面更改。
  • inline (boolean) – 内嵌模式开关，用于将一行代码插入到文本中。
  • strict (boolean) – 严格模式的开关。
  • nowrap (boolean) – 当值指定为false时，过长的行将会被自动换行，以避免出现横向滚动条。
  • noborder (boolean) – 是否显示边框的开关。
  • no_cc (boolean) – 当值为true时，code标签将会被解析，但代码块不会有格式。
  • class (string) – 添加一个新的CSS。
  • escaped (string) – 当值为false，代码块里的html转义字符不会被转义，如&lt;不会转义为<，默认为false。

lang

<code lang="java">
package dourok.info.test;
public class Main {
	public static void main(String args[]){
		System.out.println("WTF");
	}
}
</code>

package dourok.info.test;

public class Main {
	public static void main(String args[]){
		System.out.println("WTF");
	}
}

tab_size

tab_size替换制表符的空格数，下面是1的例子。

<code tab_size="1" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
 public static void main(String args[]){
  System.out.println("WTF");
 }
}

line_numbers

line_numbers显示行号的开关：

<code line_numbers="true" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

first_line

first_line第一行的行号数，下面是first_line=”3”的例子：

<code first_line="3" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

highlight

highlight模式，高亮代码段中的某几行，如例子 highlight=”1,5” 高亮行数以半角逗号分隔：

<code highlight="1,5" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

当no_links为false时会为一下关键字添加一个到官方文档的链接，默认为false，下面是no_links=true的例子，System没了链接：

<code no_links="true" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

no_links有个BUG，当我在这个代码块指定为true时，后面的代码块也没了链接。

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

lines

lines作者说明是显示固定行数,多于这个行数便会出现纵向滚动条,实际实验当指定行数小于代码行数时,代码块变成成为固定行数(该行数可在CodeColorer里面更改),而无论实际代码多少行.应该是bug.不过将lines=”-1”去掉纵向滚动条还是有效的

<code no_links="false" lines="5" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

width

width 指定代码块的宽度,多于这个宽度会出现横向滚动条 height 指定代码块的高度,单位是像素.当这个值比lines大时才会生效 width= “217” height= “217”

code lines="1" width= "217"  height= "217" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

theme

<code theme="dawn" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

inline

inline模式,为true时去掉代码块，主要用来把代码内嵌到文本中，inline模式的默认主题跟一般模式是分开的，如下例子，详见设置页面。

<code inline="true" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

strict

strict 严格模式(strict-mode)的开关,不大清楚什么意思?根据下面的例子理解下或者看下这里的说明 strict=”false”

<img src="<?php echo rand(1, 100) ?>" />

strict=」true」

<img src="<?php echo rand(1, 100) ?>" />

nowrap

nowrap自动换行的开关,默认是不换行(nowrap=”true”),当代码宽度超过代码块宽度时,会出现横向滚动条. 下面的例子是nowrap=”false”的情形

<code nowrap="false" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("This is a very very very very very very very very very very very very very very very very very very very very very very very very long String");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("This is a very very very very very very very very very very very very very very very very very very very very very very very very long String");
    }
}

noborder

noborder 是否显示边框的开关

<code noborder="true" lang="java">
package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test;

public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

no_cc

no_cc 是否高亮关键字,实际测试是取消codeColorer的效果,例子如下

<code no_cc="true" lang="java">
package dourok.info.test;
public class Main {
    public static void main(String args[]){
        System.out.println("WTF");
    }
}

package dourok.info.test; public class Main { public static void main(String args[]){ System.out.println("WTF"); } }

短标签(Short Codes) ——————-

上面提过可以用[cc]来代替<code>，可以避免使用code标签。作者还提供了跟简洁的语法[ccMODE_LANG]来定义代码块。LANG就是指定语法高亮的语言，MODE可以是下面几个模式的一个或多个：

  • i – inline
  • e – escaped
  • s – strict
  • n – line_numbers
  • b – no_border
  • w – no_wrap
  • l – no_links

模式分大小写，小写表示打开，相应的大写表示关闭，比如[cciL_java]就如同<code inline="true" no_links=false>，注意关闭标签要一致[/cciL_java]，当然后面还可以再带属性。最后再看下实际的例子：

[ccsW theme="dawn"]<code nowrap="false" lang="java">
package dourok.info.test;

public class Main {
	public static void main(String args[]){
		System.out.println("This is a very very very very very very very very very very very very long String");
	}
}</code>
[/ccsW]

<code nowrap="false" lang="java">
package dourok.info.test;

public class Main {
	public static void main(String args[]){
		System.out.println("This is a very very very very very very very very very very very very long String");
	}
}</code>

如果要显示<code></code>，就得用短标签将其包围起来，如果要显示短标签[cc][/cc]就得用不同的短标签将其包围起来。不知这样说的够明白没。

CodeColorer
wordpress插件
插件翻译
语法高亮
上一篇：ProGuard混淆丢掉空循环 下一篇：原型体(Prototype)通关
keyboard_arrow_up
compare_arrows