[分享] 用google-code-prettify在網頁嵌入代碼
最近要把網誌加入顯示程式代碼的功能，
原本想要使用 SyntaxHighlighter，
不過在找資料的過程中發現了 google-code-prettify
最後改採用 google-code-prettify 作為網頁顯示程式碼的外掛
看了一下版上文章跟精華區都沒有 google-code-prettify 的介紹
這邊跟大家分享一下自己的使用方式
網誌版：http://goo.gl/UWL1r
簡單來說就是
1. 上網下載 google-code-prettify 的檔案，連結在
http://code.google.com/p/google-code-prettify/
並放在免費空間（我放在 Dropbox）
2. 在網誌的範本中加入下面紅色標出的部分
要把連結裡的 my.url.to 替換成自己放 prettify 檔案的空間
<head>
<-- 中略 -->
<-- 1. 在 /head 標籤前加入下面兩行 -->
<link href="http://my.url.to/prettify.css" rel="stylesheet" type="text/css"/>
<script src="http://my.url.to/prettify.js" type="text/javascript">
</head>
<-- 2. 在 body 標籤內加入 onload 設定 -->
<body onload='prettyPrint()'>
</body>
3. 要使用時請把代碼用 pre 標籤包住，並加上 class="prettyprint"
<pre class="prettyprint">
// 這裡放程式代碼
std::iostream << "Hello World";
</pre>
--
[程式設計雜筆]
“編程少Code，安用之？” －－ 史記．晉世家：30
http://coder.aqualuna.me
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 112.104.53.35
Blog 近期熱門文章
PTT數位生活區 即時熱門文章
