跳到主要內容

在部落格中使用「Syntaxhighlighter」美化程式碼

常看到有人在部落格上分享一些程式碼時，可以漂亮的呈現這些程式碼。之前總是用笨笨的用HTML方法，將關鍵字標亮以"模擬"成有較高可看性的樣子，雖然這樣也是可以達到相同的效果，但總是花了大把的時間！

如果你也有和我一樣的需求，可以使用「SyntaxHighlighter」這個Open Source的程式（目前最新版為2.0.296），Syntaxhighlighter 是善心人士 Alex Gorbatchev 利用 JavaScript 搭配 CSS、Flash 開發出來的，目前已支援18種程式語言，若要使用Syntaxhighlighter有兩個方法，兩個方法的差異是有沒有自己的網頁空間：

1. 沒有網頁空間：
好心的Alex Gorbatchev好人做到底，可以將下面語法貼到自己部落格的範本樣式中，位置在</body></html>之前。

<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shCore.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushBash.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushCpp.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushCSharp.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushCss.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushDelphi.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushDiff.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushGroovy.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushJava.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushJScript.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushPhp.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushPlain.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushPython.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushRuby.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushPerl.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushScala.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushSql.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushVb.js"></script>
<script type="text/javascript" src="/pub/sh/2.0.296/scripts/shBrushXml.js"></script>
<script type="text/javascript">
SyntaxHighlighter.config.clipboardSwf = '/pub/sh/2.0.296/scripts/clipboard.swf';
SyntaxHighlighter.all();
</script>

<link type="text/css" rel="stylesheet" href="/pub/sh/2.0.296/styles/shCore.css"/>
<link type="text/css" rel="stylesheet" href="/pub/sh/2.0.296/styles/shThemeDefault.css" id="shTheme"/>

以後當要貼上程式碼時，只要切換到編輯器的 HTML 模式，然後用<pre></pre>框起程式碼的區段方式，如下：
<pre class="brush: your_language">你的程式碼</pre>

2. 有網頁空間：
可以至SyntaxHighlighter下載頁 下載grab.zip壓縮檔，將其中的 scripts 和 styles 資料夾裡的所有檔案，上傳至你的網頁空間，然後將下面語法貼到自己部落格的範本樣式中，位置在</body></html>之前。（YourWebSite是指你上傳檔案的網址）

<link type="text/css" rel="stylesheet" href="YourWebSite/shCore.css"/>
<link type="text/css" rel="stylesheet" href="YourWebSite/shThemeDefault.css" id="shTheme"/>
<script type="text/javascript" src="YourWebSite/shCore.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushBash.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushCpp.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushCSharp.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushCss.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushDelphi.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushDiff.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushGroovy.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushJava.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushJScript.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushPhp.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushPlain.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushPython.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushRuby.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushScala.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushSql.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushVb.js"></script>
<script type="text/javascript" src="YourWebSite/shBrushXml.js"></script>
<script type='text/javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.ClipboardSwf = 'YourWebSite/clipboard.swf';
SyntaxHighlighter.all();
</script>

以後當要貼上程式碼時，只要切換到編輯器的 HTML 模式，然後用<pre></pre>框起程式碼的區段方式，如下：
<pre class="brush: your_language">你的程式碼</pre>
標籤：

留言

張貼留言

這個網誌中的熱門文章

Word的合併列印如何出現「千分位」符號

今天樓下的同事突然問我一個問題，合併列印的時候如何顯示「千分位符號」（逗號），就是12 , 300。在Excel我們可以很容易的為儲存格裡的數字加上千分位的標記，但是儲存格實際儲存的還是只有數字，那個千分位符號是Excel給我們看的一種「格式」。 當我們在Word裡使用Excel做好的報表來合併列印的時候，Word會最真實的將這個數字欄位給讀出來，呈現在合併列印的欄位數值裡，無論在Excel理事不是有設定千分位符號，在Word合併列印後卻沒有出現，所以我們同樣的必須給他加上格式。 Word裡加上格式並不如Excel裡按一下就完成，加上逗號的千分位格式方法如後： 1.在Word裡插入合併列印的欄位變數。 2.在變數上按滑鼠右鍵，選擇「切換功能變數代碼」（也可以直接按Alt+F9），變數會由 << 經費 >> 變成 { MERGEFIELD "經費" } 。 3.加上格式就是把 { MERGEFIELD "經費" } 在}前加入數字格式參數 /##,###，會成為 { MERGEFIELD "經費" /# ##,### }（這裡指定五位數，以此類推） #：這個格式項目會指定要在結果中顯示的必要位數；如果結果不含該位數的數字，則 Word 會顯示一個空格。 0：這個格式項目會指定要在結果中顯示的必要位數；如果結果不含該位數的數字，則 Word 會顯示 0 (零)。 4.預覽內容，就可以發現千分位（逗號）出現，如果數值有零的話，最好可以換成 /# ##,## 0 ，避免空格出現。 數字格式參數請參考 Microsoft Office Online 。
1 則留言
閱讀完整內容

在DOS下檔案名稱加上日期

由於要完成檔案自動備份的需求，以減少每日使用人工的麻煩，也可以避免人為疏失造成的遺漏，需要定時拷貝某個檔案至遠端，在檔名加上日期以避免檔案覆蓋的情形。由於近來接觸Linux較多，自然比較熟悉Linux的Shell語法，回到Windows裡卻想不到解決的方法。 開始使用電腦時，已經活生生的跳過了DOS的年代，雖然會使用Copy語法，卻不知怎麼加上系統日期，參拜估狗大師後得到了解答，使用%DATE%環境變數。 在DOS中使用date會顯示目前日期，但會要求輸入新的日期時間不符合需求，雖然加上"/T"不會詢問新時間，但因為date是指令無法使用在copy的語法中，所以我們使用%DATE%環境變數，所以在我們要加上日期的檔案上加上此環境變數：copy test.txt test_%DATE%.txt 結果並不如我們想像，使用echo看%DATE%的傳回值，會出現"2007/12/4"，使用於copy語法裡系統回應「命令語法不正確」，我們必須去除「/」的符號，這就需要用到環境變數的擴充功能了！ 用echo來測試： # echo %DATE:~0,4% ： 取環境變數%DATE%的值，由第一碼開始取四碼（可以取出"西元年"的值）。 # echo %DATE:~5,2% ：取環境變數%DATE%的值，由第六碼開始取二碼（可以取出"月"的值）。 # echo %DATE:~8,2% ：取環境變數%DATE%的值，由第九碼開始取二碼（可以取出"日"的值）。 原先的 #copy test.txt test_%DATE%.txt 要更改成 #copy test.txt test %DATE:~0,4% %DATE:~5,2% %DATE:~8,2% .txt 拷貝後的檔案為test_20071204.txt
張貼留言
閱讀完整內容

使用者只能 SFTP 登入自己的家目錄

使用者只能 SFTP 登入自己的家目錄 老師的電腦動畫課堂的期末作品，是開放讓學生透過 FTP 上傳自己的作品及網頁至實驗室的伺服器，由於 FTP 是明碼的封包傳輸於最近升級系統後，便考慮改用 SFTP（SSH File Transfer Protocol）來提供上傳的服務。 提供 SFTP 上傳的同時，希望使用者和以前一樣只能使用 SFTP 無法使用 SSH 登入伺服器。SFTP 為 SSH 的檔案傳輸服務，預設建立帳號的時候使用者同時可以使用這兩種服務。透過 SFTP only + Chroot 設定我們能限制使用者僅能 SFTP 並且無法離開自己的家目錄去到處閒晃。 安裝 OpenSSH 如果安裝的是 Ubuntu Server 應該在安裝過程會安裝 openssh-server 套件，沒有的話可以利用下面的指令安裝。 $ sudo apt-get install openssh-server 新增一個給 SFTP 使用的群組 sftpaccess $ sudo groupadd sftpaccess 修改 OpenSSH 設定檔 編輯 /etc/ssh/sshd_config 設定檔，在約 77 行的地方找到 Subsystem sftp /usr/lib/openssh/sftp-server 註解此行並修改為 Subsystem sftp internal-sftp 。 $ sudo vim /etc/ssh/sshd_config #Subsystem sftp /usr/lib/openssh/sftp-server Subsystem sftp internal-sftp 在檔案的尾端加上下面的片段 Match group sftpaccess ChrootDirectory /home/%u X11Forwarding no AllowTcpForwarding no ForceCommand internal-sftp 建立新的使用者並加入 sftpaccess 群組 在設定檔中，我們設置了 sftpaccess 這個群組套用要做 ChrootDirectory 的設定，所以我們將要限制的使用者，加入這個群組中。 $ sudo useradd
張貼留言
閱讀完整內容