WordPress 技術

ソースコードはSyntaxHighlighter、ではコマンドラインは?

技術的な説明をするときに、ソースコードを載せて説明したりしますが、そのときにソースコードを体裁良く表示してくれるSyntaxHighlighterという便利なJavaScriptがあります。ここでもWordPressのプラグインとして有効化し、利用させてもらっています。

ソースコードの表示したければ、SyntaxHighlighterを使えばいい、というのは調べて簡単に分かりました。しかし、Linuxのコマンド入力などを説明するためにも同じようなものはないかと、いろいろと調べましたがなかなか見つかりませんでした。

やっと「コマンドラインをSyntaxHighlighterのように表示したい」という思いを「コマンドライン SyntaxHighligher」というキーワードにして検索したときに、所望の答えが見つかりました。実は、SyntaxHighlighterにすでに搭載されている機能とのことです。 例えば、以下のように書きます。

1
2
3
4
[bash]
> cd /home/user
>
[/bash]

すると、

1
2
> cd /home/user
>

のように表示されます。

ちなみに前者は、

1
2
3
4
5
6
<pre class="brush:text";>
&#91;bash]
> cd /home/user
>
[/bash]
</pre>

のように書いています。<pre class="brush:~>,</pre>で囲み、「<」の文字実体参照「&#91;」を使うのがポイントです。

また、ドンピシャの答えを出してくれたところは、
http://ja.forums.wordpress.org/topic/9002
です。

-WordPress, 技術
-,

S