phpのソースコードをsyntaxHighlighterを使ってサイトに載せる

自サイト運営に伴い、OAuthなどの勉強をしていると忘備録に解説がてらコードをサイトに載せたくなった。
以下に載せ方をまとめる。

▼<pre><code>を使った記述

<pre><code>

　【ソース】

</code></pre>

できるといえばできるけど、芸がない。


▼gist ( https://gist.github.com/ ) を使う。



gistにアクセスしソースコードを貼り付けていくと最終的に.jsファイルが与えられるのでそれをhtmlに貼り付けるだけ。
FC2ブログだと表示がおかしいけど、自サイトでは問題なかった。原因不明。
↓こんなかんじに表示されるはず



..jsファイル一つ読み込むだけでコードが出力されるので、htmlに直接ソースを書かなくて済む。


▼syntaxHighlighter を使う



細かい設定画できるので結構融通が効くが、phpをエスケープ処理せずに突っ込むとなかなか正しく表示されなかったので諦めた。画像はエスケープ処理したもの。

端折って話すと↓のように記述する場合にはエスケープ処理が必要で

<pre class="brush: php">

【ソース】

</pre>

こうするとエスケープ処理が必要ないらしいが、ダメだった。原因不明。

<script type="syntaxhighlighter" class="brush: php"><![CDATA[

【ソース】

]]></script>

一応preタグをの中身をエスケープ処理さえすれば使える。


gitのメリットは、
　　　・スクリプトやスタイルを読み込む必要がない
　　　・scriptタグで.jsファイルを囲むだけなので、ソースコードをエスケープ処理したり、拡張子に合わせた設定をする必要がない。
対してデメリットは、
　　　・syntaxHighlighterでできる豊富なオプションが使えない。
　　　　例）開始行番号の変更、指定行をハイライト等
　　　・デザインをいじれない
　　　・ファイルまるごと表示されるので表示したい範囲を指定できない


かんたん->git
凝ったことがしたい->syntaxHighlighter
って感じになってしまった