在 Blogger 中使用 google-code-prettify 显示程式码
google-code-prettify 是一支不错的程式码高亮度显示程式,特点为:
- 支援 15 种程式语言(但某些语言似乎还没完成)
- 程式仅两个档案
- 加载速度较快
缺点为:
- 跟 IE 的相容性比较不佳,在 IE 内复制程式码时无换行符号
- 无行号显示
- 仅支援 "<pre>" 区块
- 程式码过长时不会自动显示卷轴 (可透过修改 CSS 解决)
安装步骤
- 修改 blogger 样板,搜寻 "</head>",在 "上方" 加入
<link href='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.css' type='text/css' rel='stylesheet' /> <script type='text/javascript' src='http://google-code-prettify.googlecode.com/svn/trunk/src/prettify.js'></script>
(因为 "偷吃步" 的关系,程式直接连到 google-code-prettify 的 SVN 上,你可以视情况下载回来放到自己的服务器)
- 继续搜寻 "<body>",在标签内的 onload 事件加入:
prettyPrint();
- 储存即可。
使用方法
- 使用 "<pre>" 区块,需将 "&" 转换为 "&"、"<" 转换为 "<"、">" 转换为 ">":
<pre class="prettyprint"> 程式码 </pre>
我也在用这个,感觉很好用。
蛮好用的!这样一来要摆出程式范例就方便多了!!