27 9月 2007

增加SyntaxHighlighter到自己的Lifetype上

SyntaxHighlighter
是一個能為程式碼加上顏色的好物!
方法是透過javascript & css為<textarea>中的code加上顏色


主要是參考
中文翻譯者的網站:
http://www.dcaid.com/article/article.asp?tid=52

原作者網站:
http://www.dreamprojections.com/syntaxhighlighter/

首先 到這個地方下載我自行改好的程式
下載

將這個檔案解壓縮後放在lifetype的目錄下

然後到你所使用的template的目錄下
ex: templatesstandard
找到header.template與footer.template

首先在header.template裡頭的<head>...</head>之間插入

<link type="text/css" rel="stylesheet" href="SyntaxHighlighter/Styles/SyntaxHighlighter.css"></link>
<link href="SyntaxHighlighter/Styles/TestPages.css" rel="stylesheet" type="text/css">

然後再到footer.template裡頭的</body>之前插入

<script class="javascript" src="SyntaxHighlighter/Scripts/shCore.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushCSharp.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushPhp.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushJScript.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushJava.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushVb.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushSql.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushXml.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushDelphi.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushPython.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushRuby.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushCss.js"></script>
<script class="javascript" src="SyntaxHighlighter/Scripts/shBrushCpp.js"></script>
<script class="javascript">
dp.SyntaxHighlighter.HighlightAll('code');
</script>

沒有留言: