2011年9月29日 星期四

部落格顯示程式的好幫手「SyntaxHighlighter」

話說最近想將一些程式碼放上來做記錄,
所以找了很多的程式顯示器來實驗,
因為直接打上來常常會造成排版困難與行數的解讀不易,
直到看到了這個顯示的好幫手「SyntaxHighlighter」就解決了排版問題。

首先下載相關的程式碼壓縮檔,
然後再將這些壓縮檔解壓縮後放到網路空間內(像我是放置在 Dropbox 內),
接下來就準備在部落格中引用這些元件了。


先到部落格的後台內,
然後到能修改部落格的 HTML 頁面中,
加入下面的程式碼到 </head> 之前的位置:


接著往下加入支援的程式排版的歸類,
當然可以省略一些不加,
全加下去會讓部落格變慢的…




















然後只要在發文時,
進到能修改文章 HTML 的地方,
於欲放程式碼處先填上 <pre class="brush: 程式語法類別">,
再放上程式碼,
最後加上結尾</pre>,
按下發文就可看到成果了!
  • ActionScript3:as3, actionscript3 shBrushAS3.js
  • Bash/shell:bash, shell shBrushBash.js
  • ColdFusion:cf, coldfusion shBrushColdFusion.js
  • C#:c-sharp, csharp shBrushCSharp.js
  • C++:cpp, c shBrushCpp.js
  • CSS:css shBrushCss.js
  • Delphi:delphi, pas, pascal shBrushDelphi.js
  • Diff:diff, patch shBrushDiff.js
  • Erlang:erl, erlang shBrushErlang.js
  • Groovy:groovy shBrushGroovy.js
  • JavaScript:js, jscript, javascript shBrushJScript.js
  • Java:java shBrushJava.js
  • JavaFX:jfx, javafx shBrushJavaFX.js
  • Perl:perl, pl shBrushPerl.js
  • PHP:php shBrushPhp.js
  • Plain Text:plain, text shBrushPlain.js
  • PowerShell:ps, powershell shBrushPowerShell.js
  • Python:py, python shBrushPython.js
  • Ruby:rails, ror, ruby shBrushRuby.js
  • Scala:scala shBrushScala.js
  • SQL:sql shBrushSql.js
  • Visual Basic:vb, vbnet shBrushVB.js
  • XML:xml, xhtml, xslt, html, xhtml shBrushXml.js

沒有留言:

張貼留言