由于我这一段对Emacs很有兴趣,发了不少关于这玩意儿的文章。但博客园的代码高亮并不支持Emacs Lisp,之前一直也没怎么管,前几天看见李杀的这篇 Syntax Coloring with Google-Code-Prettify,想试试博客园上面能不能折腾出来,于是开始折腾这个Google Code Prettify,最后又发现博客园的语法高亮插件SyntaxHighlighter也可以搞定。
方法一: 基于博客园自带的SyntaxHighlighter
博客园自带的代码动态高亮插件是SyntaxHighlighter,但博客园没有提供用于lisp的刷子(brush)——毕竟这个语言在博客园毕竟小众 :-),但我在网上找了一圈也没有找到,只找到一个clojure的,略微改了改,凑合着可以用上。示例效果如下:
(defun iedit-symbol-in-defun ()
"Enter `iedit-mode' to rename the symbol in current function, or exit it."
(interactive)
(if iedit-mode
(progn
(iedit-mode -1)
(widen))
(progn
(if (thing-at-point 'symbol)
(progn
(narrow-to-defun)
(iedit-mode t)
(message "When done, run `epy-iedit-in-defun' again to quit.")
)
(error "You need to put cursor on identifier.")
))))
下面说一下方法:
2. 打开博客园管理后台,找到“设置”一栏,在“公告”或者“页首html代码”一栏填入刚才找到的刷子代码(当然,前后得加
3. 写文章时,点击第二个“插入代码”按钮(第一个按钮不是用JS代码来动态着色,而是由博客园后台着色产生对应的HTML代码,然后再插入编辑器的。它只适合博客园后台能支持的语言类型);
4. 在弹出的对话框中贴上代码,“编程语言”一项随便选一个即可;
5. 回到博文编辑器,点击那个"HTML"按钮(就在刚才“插入代码”按钮的右边),找到刚才贴入的代码,修改代码语言名称(也就是把
方法二:采用Google Code Prettify
1. 类似地,在后台“设置”中,将如下代码插入到在“公告”或者“页首html代码”一栏
window.setTimeout(prettyPrint,2000);
(如果你担心用户们访问googlecode网站存在问题(万恶的G_F-W),可以将这几个文件传到博客园后台,然后用http://files.cnblogs.com/bamanzi/prettify.js 这样的路径来引用)
2. 在编辑文章的时候,同样,也是用第二个“插入代码”按钮来贴代码,“编程语言”一项任选;
3. 回到博文编辑器,点击那个"HTML"按钮(就在刚才“插入代码”按钮的右边),找到刚才贴入的代码,将
改为:
为什么这么改:prettyprint是Google Code Prettify的识别符号,而lang-lisp则是标明语言类型,具体说明可参看它的README文档(里面也有各类语言的扩展链接,比如F#, YAML等; 还说明了如何添加行号等)
效果示例:
(defun iedit-symbol-in-defun ()
"Enter `iedit-mode' to rename the symbol in current function, or exit it."
(interactive)
(if iedit-mode
(progn
(iedit-mode -1)
(widen))
(progn
(if (thing-at-point 'symbol)
(progn
(narrow-to-defun)
(iedit-mode t)
(message "When done, run `epy-iedit-in-defun' again to quit.")
)
(error "You need to put cursor on identifier.")
))))
两种方法的比较
总的来说,第一种方法比较好,因为除了正文,用户评论的代码也是用SyntaxHighlighter来高亮的,只要评论时写[code=elisp]....[/code]就可以了。
但就Clojure/Lisp的实现而言,我找的SyntaxHighlighter刷子有点问题:它会把(defun ....)和(narrow-to-defun)里面的defun都着色,这是由于它的核心代码在正则表达式中用\b来识别关键字的边界,但"-"这个字符偏偏是Lisp中非常常用的字符,所以得修改刷子里面的this.getKeywords()实现才行,我暂时还没有找到比较简单的修正办法。
所以,目前我倾向于两者都用,前者用在正文里面,后者留给评论使用。