几年前开始用的 SyntaxHighlighter2 插件来给代码语法高亮,由于懒一直没有更换,今天实在看不下去,而且又发现 PRISM 的简洁耐看,于是决定将 Blog 和 Wiki 页面都替换过来。
WordPress 的话很简单,可以使用插件,或者如下:
- 到这里按需求下载
- 加载 prism.js 与 prism.css
- 需要高亮的代码用 <pre><code class=”language-xxx”></code></pre> 包围
但是我使用的 Vimwiki 生成 pre 标签的语法下不能再加生成 code 标签的语法,所以我尝试用我粗陋的 jQuery 技能来实现一下。
$("#content pre").each(function() {
var language = $(this).attr('class');
$(this).wrapInner("<code class='" + language + "'></code>");
});
在 default.tpl 模板文件中,头部加载 prism.css,然后在</body>标签前加入 jQuery 的 js 文件,然后代码如下:
接下来加载 prism.js
在 Vimwiki 中使用
{{{class="language-php"
echo "Hello World!";
}}}