WordPressのコードハイライトでSyntaxHighlighterとAddQuicktagを使う方法

SyntaxHighlighterとAddQuicktagが相性抜群

SyntaxHighlighterはコードを特定の文字で囲むとそれをプログラムコードとして認識してくれるものです。

下記のサイトにコード対応表がのっています。
SyntaxHighlighter – PowerShell Example

書き方は[コード種類]ここにコード[コード種類/]のようにして使います。

コードの種類は上のリンクを参考しましょう。

AddQuicktagを使うとさらに便利に

コードを書くのが楽しくなって、コードを毎回外部に公開したくなったら、AddQuicktagが非常に便利です。このプラグインはあらかじめ自分で作った定型のコードを登録しておけるプラグインです。他にも便利なソフトウェアはあるかもしれませんが、プラグインとしてブログの投稿画面に組み込まれるので便利です。

プログラムコードをブログに毎回のせたいという人にとっては非常に便利です。プラグインは増えすぎるのもどうかと思いますがこの２つのプラグインは必須のレベルかもしれないです。

AddQuicktagの使い方はちょっとコツがいります

登録するときは開始タグと終了タグを決めます。ボタンのラベルの名前はなんでもいいですが、関連があってわかりやすいものがよいでしょう。問題は画像の右側のチェック項目です。これにチェックをつけておかないと、ブログ投稿画面に操作パネルが表示されません。

このようにAddQuicktagを使って使いたいタグを登録しておきSyntaxHighlighterをインストールしておけば、コードの見栄えを簡単によくすることができますね。特に知識もなく使えるのでWordpressを使っている人にはおすすめしたいです。

ここより下からは追記

当ブログでは現在SyntaxHighlighterは使っていません。Cocoonに内蔵されているhilight.jsを使ってコードをハイライトしています。

SyntaxHighlighterのデメリット

SyntaxHighlighterのデメリットはコードを指定のタグで囲う必要があることです。たとえばpythonコードだったら[py][/py]のようなタグで囲む必要があるわけですが、他のハイライト方法を使いたくなった場合に手軽に変更できなくなります。

たとえば記事がたまってきたあとにハイライト方法を変更したくなった場合は該当記事をすべて修正する必要がでてきます。といってもこれはhilight.jsを使った方法にもいえることですが…。

結論としてSyntaxHighlighterとAddQuicktagはプラグインの管理がめんどうなので現在は使っていません。

WordPress プラグイン＆WebAPI 活用ガイドブック [Version 3.x対応]

翔泳社

Amazonで探す

楽天市場で探す

Yahoo!で探す