文章目录
  1. 1. 反引号的代码块
    1. 1.1. 语法
    2. 1.2. 必选项
    3. 1.3. 可选项
    4. 1.4. example
  2. 2. 使用Code Block的方式
  3. 3. 使用转义字符串
  4. 4. 使用正则表达式替换
    1. 4.1. 替换方法
  5. 5. Gist代码内嵌
    1. 5.1. 语法
    2. 5.2. example

本文主要为你讲解如何在Octopress中支持语法高亮，主要参考了Octopress的官方文档，如果你有兴趣，可以直接参考它的官方文件shareing code snippets。

反引号的代码块

使用backtick_codelock过滤器，可以使用Github的最适用的代码高亮块。使用三个反引号开始，后面跟着一个空格，接下来是高亮语言，具体如下所示：

语法

1
2
3
``` [language] [title] [url] [link text] [linenos:false] [start:#] [mark:#,#-#]
code snippet
```

必选项

  • [language] - 指明你所使用的语言: objc、js、html、bash、ruby…
  • [title] - 代码标题
  • [url] - 代码链接，点击这个可以下载你的代码
  • [link text] - 对链接的解释文本，默认是link

可选项

  • start：# - 行号从哪里开始
  • mark：#，#-# - 标记某一行代码
  • linenos：false - 对高亮代码块不添加行号

example

一个有关app delegate的效果如下：

app delegatelink
1
2
3
4
5
6
7
8
9
10
11
@implementation Cocoa1AppDelegate
 
@synthesize window,siteUrl,pageContents;
 
- (void)applicationDidFinishLaunching:(NSNotification *)aNotification
{
    // Insert code here to initialize your application
    model = [[Cocoa1Model alloc] init];
}
 
@end

它使用的markdown代码如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
``` objc app delegate http://www.yoururl.com
@implementation Cocoa1AppDelegate
 
@synthesize window,siteUrl,pageContents;
 
- (void)applicationDidFinishLaunching:(NSNotification *)aNotification
{
    // Insert code here to initialize your application
    model = [[Cocoa1Model alloc] init];
}
 
@end
```

注意：各个选择之间用空格分开，markdown会根据关键字自动识别相关的language，title，url条目。

如果引用的语句只有一段，不分行，可以用 ` 将语句包起来： `inline codeblocks`

使用Code Block的方式

目前自己的博客这种方式用的比较多，前面写的文章目前全部修改成为了这种方式，感觉这种方式和pygnment的方式差不多，之前全部采用的是pygnment的方式，利用正则表达式把所有文章的代码高亮全部改成了使用code block。它的具体语法如下所示：（与pygnment很相似，指定语言即可）

1
2
3
{% codeblock [title] [lang:language] [url] [link text] %}
code snippet
{% endcodeblock %}

和之前描述的类似，中括号的内容是可选的。

使用转义字符串

转义字符串：&符号+实体名字+分号 或者 &符号+#实体编号+分号。比如，要显示小于号（<），就可以写 &lt; 或者 &#60;

HTML ASCII 参考手册：http://www.w3school.com.cn/tags/html_ref_ascii.asp

使用正则表达式替换

这种方式可以替换博客内容，使得博客中所有文章的代码高亮使用Code Block。自己使用的是sed来完成的操作，似乎都没有用到正则表达式，只是简单的替换，做个简单的记录吧。

替换方法

进入到source/_posts目录下，在终端输入如下代码：

1
sed -n 's/\(\ highlight\ \)/\1/p' *

上面将会把当前目录下的含有{\% highlight的文件的那行都显示出来，中间会将含有该特殊字符的行都打印出来，中间可以看到自己的博客内容都用到了哪些类型文件的语法高亮，将对应的代码高亮进行替换即可。

其实这种方式就是简单的搜索替换，应该算不上使用正则表达式了，只是写下来做下笔记了，防止以后再用具体操作如下所示：

1
sed -i 's/\(\ highlight\ bash %}\)/\ codeblock\ lang:bash\ %}/' *

Gist代码内嵌

当使用这种方式的代码高亮时，仅仅需要的是gist的id，对gist不了解的可以上google搜索下，个人的理解是，gist对每段用户上传的代码段都会有一个对应的id，当用户给出对应的代码的id后，将会从gist上面下载对应的已经高亮的html文件，最终在用户的页面上显示出来。

语法

1
{% gist gist_id [filename] %}

example

1
{% gist 996818 %}

上述代码的片段在Octopress中的markdown文件中输入之后，得到的效果如下：