2008年11月9日 星期日

如何在 Blogger 張貼漂亮的程式碼

在「版面配置」的「修改 HTML」中的「</body>」與「</html>」兩個標籤中加入以下 JavaScript 程式碼即可:
<!--  syntax highlighting -->

<link href="http://godleon.googlepages.com/SyntaxHighlighter.css" rel="stylesheet" type="text/css" />
<script src="http://godleon.googlepages.com/shCore.js" type="text/javascript" xml:space="preserve"/>
<script src="http://godleon.googlepages.com/shBrushJava.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushCss.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushXml.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushVb.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushSql.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushRuby.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushPython.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushPhp.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushJScript.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushDelphi.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushCSharp.js" type="text/javascript" xml:space="preserve" />
<script src="http://godleon.googlepages.com/shBrushCpp.js" type="text/javascript" xml:space="preserve" />

<script type="text/javascript" xml:space="preserve">
dp.SyntaxHighlighter.ClipboardSwf = 'http://godleon.googlepages.com/clipboard.swf';
dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');
</script>

dp.SyntaxHighlighter.BloggerMode();
dp.SyntaxHighlighter.HighlightAll('code');

<!-- end of syntax highlighting -->

使用方式可以參考官方網站的說明喔!


參考資料

  1. Sjcywg's Blog!: Syntax Highlighting

  2. Ticore's Blog: 自改版 dp.SyntaxHighlighter 1.5.1.1

  3. Usage - syntaxhighlighter - Google Code - How to use SyntaxHighlighter.

沒有留言:

張貼留言