2013年9月1日 星期日

[工具]Syntaxhighlighter程式碼編輯注意項目 & 客製化的介面設定補充

從昨天分享完Syntaxhighlighter的安裝文章之後
本來今日要開始分享我的一些撰寫程式碼小心得
但是卻遇到了一個問題
就是我在寫for迴圈或是有寫到 "<" or ">" 的符號是,不知道為什麼總是無法編輯成功
我自己也相當的納悶,後來上網google大神查了一下
才發現有些特定的符號需要用另一種方式來編輯
難怪我在那編輯了老半天都無法編輯成功

ps :想要了解基本Syntaxhighlighter的設定步驟,請參考我上篇寫的
"Blogger如何利用Syntaxhighlighter將程式碼著色"



網路上有很多解決上述問題的辦法,像是修改一些連結設定等等
但是我提供一個比較簡單容易操作的作法來跟各位分享
我主要的參考資訊是從這位作者的文章來的"使用SyntaxHighlighter工具顯示HTML語法技巧"
大家不訪可以閱讀收穫不同知識

回歸正題,要解決一些特定符號HTML無法辨識的問題
我使用的是這個網站 "Format My Source code for blogger"
這個網站基本上就已經駕好了轉換語法機制,只要將想分享的程式碼貼到裡面
做轉換出來就可以直接使用了,我覺得相當的方便!

<Step 1>
在紅色框框打想要show出的程式碼

<Step 2>
這邊我是直接用預設的格式,
其他format格式可以自行try try看

 <Step 3>
紫色框框這邊會show出轉換結果
把轉換的結果重新貼到網誌編輯
ps:如果忘記怎麼將程式碼編輯show到網誌裡,記得參考我上篇的網誌

如此一來就大功告成了歐!

接著此部分本來預定要跟大家分享客製化的介面
因為我發現在css檔案裡面中,有好幾種不同的主題可以供我們使用
"官網提供的Themes選項連結 "大家可以依照自己的喜好風格來設定程式碼主題
在這邊跟大家大力推薦一位部落格的網誌 "為網頁中的程式碼排版 "
他在裡面寫得相當完整,他將不同主題的layout畫面全部show出來
也有寫到SyntaxHighlighter預設顯示設定的操作小技巧
所以我覺得自己沒必要再寫一篇一模一樣的東西
我相信看完他的網誌,對於Syntaxhighlighter的使用能功力大增



Related Articles

0 意見:

張貼留言

技術提供:Blogger.