文法高亮外掛程式SyntaxHighlighter的使用教程

首先到這裡下載其源碼。裡面東西挺多的，我們基本上可以把它放到兩個檔案夾就是。其中shCore.js與shCore.js與clipboard.swf放到js檔案夾中，shCore.css還有另一個CSS檔案（隨你挑一個吧）與所有圖片放到style檔案夾中。如果你想高亮html或xml代碼，那麼就在js多放一個shBrushXml.js，如果要高亮javascript代碼，就要多加一個shBrushJScript.js代碼。最後就是在我們的網頁上引用它們。

    <link type="text/css" rel="stylesheet" href="style/shCore.css"/>    <link type="text/css" rel="stylesheet" href="style/shThemeRDark.css"/>    <script src="js/shCore.js" type="text/javascript" ></script>    <script src="js/shBrushJScript.js" type="text/javascript" ></script>    <script src="js/shBrushCss.js" type="text/javascript" ></script>    <script src="js/shBrushXml.js" type="text/javascript" ></script>

然後再在頁面上建立一個script標籤，在裡面添加代碼，進行配置與調用那個flash檔案。

      SyntaxHighlighter.config.clipboardSwf = 'js/clipboard.swf';      SyntaxHighlighter.all();

這些代碼是無需放於window.onload中的。再最後是如何使用，把要高亮的代碼放於一個pre檔案中，這些代碼記得要事先處理，把變成>。然後添加一個特殊的類型，brush加引號加上你們的代碼的類型。如要高亮javascript則要class="brush:javascript"，高亮css則要class="brush:css"。當然成功與否還在於你是否引進相關的javascript檔案（指shBrushJScript.js等）

注意，這時代碼不但只高亮了，還會多出行號與工具列，這就要更細緻的配置。它們都在那個類名上做手腳，如把行號禁止了，就要class="brush:javascript;gutter:false;"。

這些參數具體可見這裡

 <pre class="brush:javascript;gutter:false;toolbar:false">      dom.ready(function(){        test("dom.ready");      }); </pre>