如何让 Markdown 支持代码高亮?

向上的丁子 发布于 2013/03/13 14:16
阅读 33K+
收藏 4

@红薯 你好,想跟你请教个问题:

能给我讲讲如下两种方式在 Markdown 中代码高亮的实现?

第一个是本站点的

OSC 的 Markdown 编辑器支持代码高亮,你可以在代码上方使用 <!--lang: java--> 或 lang: java 的形式来指定编程语言,这样文章在显示的时候会使用 SyntaxHighlighter 自动按照指定的语言进行语法着色。

如图

第二个是这个

最近再用 github + jekyll 搭建一个博客,想自定义代码高亮的方式……


加载中
0
tsl0922
tsl0922

解析markdown的时候,读取每个代码块设置的语言(可以用正则提取),然后生成HTML时给pre标签按SyntaxHighlighter要求的格式加上语言就可以了,可能需要修改markdown解析器源码。这个OSC使用的修改后的Java版码:

https://github.com/tsl0922/markdownj

或者可以使用 Google Code Prettify 之类的可以自动识别编程语言的库

0
c61811
c61811

最近刚好研究这个比较多,使用了很多,对多种语言都支持的目前还算是pygments了

参考资料:

http://my.eoe.cn/xiayang6/archive/1174.html

http://pygments.org/

目前在blog.eoe.cn和wiki.eoe.cn都是采用pygments代码高亮效果,有php和ruby调用方法

c61811
c61811
回复 @snailsir : pygments是可以加行号的 可以设置不同的参数,比如php:pygmentize( $code, $lang, $style="default", $tabwidth=4, $extra_opts="-O linenos=html" );
向上的丁子
向上的丁子
我现在用的正是这个, 但是不能加行号。想用 jQuery 修改生成的源码部分的 html 代码,试了下(以前没学过jQuery,为了加行号,刚看了一些资料),没成功。请问你知道怎么加行号吗?
0
向上的丁子
向上的丁子

引用来自“tsl0922”的答案

解析markdown的时候,读取每个代码块设置的语言(可以用正则提取),然后生成HTML时给pre标签按SyntaxHighlighter要求的格式加上语言就可以了,可能需要修改markdown解析器源码。这个OSC使用的修改后的Java版码:

https://github.com/tsl0922/markdownj

或者可以使用 Google Code Prettify 之类的可以自动识别编程语言的库

我困惑的是,改了 markdown 解析器源码后,怎么让我托管在 github 上的博客使用?

Google Code Prettify 我用了,但感觉不如 pygments,而 pygments,我试了试,加不了行号。于是我想着用 js 修改生成的源码部分html代码,加上行号相关的部分,又由于小弟刚入手js,初步试了试,没成功。依你经验,我这个想法可行吗?又或者还有其他好办法?或者能不能举几个例子?

返回顶部
顶部