Loading...

使用dp.SyntaxHighlighter 程式碼色彩顯示工具,讓紀錄程式心得更有可看性

Temperature: 0 °C

ChungChung
author_tools

說好了要在innstory裡寫下故事紀錄...

所以是不是有方便紀錄的工具或方式,就變成在開發innstory的最大課題...

為了方便紀錄下程式碼(年紀大了,偶爾還是會有這樣的需求)...昨天將顯示code的部份改用了dp.SyntaxHighlighter的工具,引用後的顯示結果將如下:

使用dp.SyntaxHighlighter 程式碼色彩顯示工具,讓紀錄程式心得更有可看性
這是一個 JavaScript版的程式碼亮顯工具,如上圖顯示,在紀錄程式碼時有較高的閱讀性。

使用非常簡單,而這也是選擇使用他的原因....

首先可先到官網下載SyntaxHighlighter_1.5.1版本Url link

解開壓縮檔後會出現3個資料夾Scripts、Styles、Uncompressed將其引入

<link type="text/css" rel="stylesheet" href="./Styles/SyntaxHighlighter.css">
<script language="javascript" src="./Scripts/shCore.js"></script>  
<script language="javascript" src=./Scripts/shBrushCSharp.js"></script>//載入所需支援的語言
<script language="javascript" src="./Scripts/shBrushXml.js"></script>  
<script language="javascript">  
window.onload = function () {
dp.SyntaxHighlighter.ClipboardSwf = './Scripts/clipboard.swf';  
dp.SyntaxHighlighter.HighlightAll('code');  
}
</script>

接著只要將code寫入在<pre>或<textarea>裡皆可,方式如下
<pre name="code" class="Language">   
... some code here ...  
</pre>

<textarea name="code" class="Language" cols="30" rows="10">
... some code here ...  
</textarea>

就這樣就可以實現程式碼色彩顯示,目前innstory裡也使用了這個方式,接下來紀錄code的部份應該就能改善閱讀性了.....

話說這工具其實存在也很久了...1.5.1版好像也是在2007年就已經釋出....@@

腳步還真慢啊.....

台北市內湖區江南街71巷75弄 Go

https://innstory.com/story-使用dpSyntaxHighlighter_程式碼色彩顯示工具讓紀錄程式心得更有可看性-538
寫程式筆記

Prev
 PHP使用GD函數切正方形圖像

Next
濱菊企業有限公司 

Nearby Attractions

台北市內湖區江南街71巷75弄-Nearby Attractions

  • 慈雲寺 Go
  • 中山基督長老教會 Go
  • 國立臺灣大學日式宿舍-青田街... Go
  • 臺北工業學校紅樓 Go
  • 士林神農宮(芝蘭廟) Go
  • 總督府農業試驗所昆蟲部 Go

About the Author

Chung

我是chung
網路工作者
主業是網站系統開發建置
副業是做夢,寫故事
作品請參考/teme.biz
做夢請參考/innstory.com
聯絡/chung.teme@gmail.com

#有人用筆寫日記,有人用歲月寫日記,有人用照片寫日記,而我,用innstory寫日記。

Visitor message

Leave some footprints to prove that you visited me

Recommended reading

Author's other related stories

PHP的日期時間相減方法之二

PHP的日期時間相減方法之二...

這幾天很忙...忙著寫客戶的系統.. 忙到沒時間亂開其他網站... 忙到沒時間去研究新東西... 忙...

Linux底下Apache啟動、停止、重啟指令

Linux底下Apache啟...

a5 如果apache安裝成為linux的服務的話,可以用以下命令操作: service httpd...

PHP 如何檢測陣列是否有重複值

PHP 如何檢測陣列是否有重...

pexelsphoto55 PHP陣列,是在coding時常用到的儲存資料的方式。 但,若陣列中的資...

Recommended reading

Other stories happened at this address

HTML5 Geolocation

HTML5 Geolocat...

說真的,HTML Geolocation的功能真的好用... 輕鬆就可以讓網站也能取得目前所在的地理...

所以兒子,​​​​​​​你希望我待會喝鹹魚咖啡?

所以兒子,​​​​​​​你希...

s 歲個月,開始會跟我搶咖啡喝~ 我說U啊,等你學會怎麼開再來跟我搶吧( ̄∇ ̄) 然後,他開始拿著我...

星期五披薩夜

星期五披薩夜

星期五囉,按照慣例今天我是不用下廚的... 但台北現在仍下著雨,所以今晚就叫達美樂囉... 達美樂打...

一聽到要帶他出門,馬上給了我一個笑得開懷的笑容~

一聽到要帶他出門,馬上給了我...

一聽到要帶他出門,馬上整裝完畢( ̄∇ ̄) 堅持穿上自己選擇的鞋子,還要自己穿。 堅持背上背包。 堅持...

你是否知道我故事中的角色?

你是否知道我故事中的角色?

那天~突然在想....... 有看我故事的人,是否會知道我寫的那些故事裡,裏頭的人事物對我有何意義?...

拼圖時間

拼圖時間

父子時間。 發現原來玩拼圖也可以教母語,我一邊拚著一邊用客家話要U去找同顏色的拼圖。 這傢伙就一直檢...

Please select an option

error

Hi, thank you for your participation, but you cannot vote repeatedly~

Join innstory now and start recording your story.

"Innstory" is a place to store stories. We are committed to becoming a warm platform. Deepening the bonds between people is our direction.
We are convinced that the blockchain between people is not just a cold calculation. Join us now.

Wrong format