はじめに
今まで WordPress でプログラムのソースコードをキレイに表示するプラグインといえば Crayon Syntax Highlighter でした。
Crayon Syntax Highlighter は、サポートする言語が非常に多く、表現も美しく、これぞ定番という感じでした。
ただ、このプラグインの最終更新日は４年前なんですよね。。。
さすがに４年前の更新だと、WordPressとの互換性も心配だし、さらにセキュリティ的に大丈夫か不安になります。実際、PHP 7に上げた時、エラーを吐き出して対応が必要でしたしね。
で、 Crayon Syntax Highlighter の移行先として代替となるプラグインを探してみたのですが、Enlighter がとってもよさ気でした。
表現力は、さすがに Crayon Syntax Highlighter よりは劣るのですが、Enlighter は Crayon Syntax Highlighter の互換機能を持っていて、移行作業が必要ありません。大量の記事を持っている身としては、とても魅力的な機能です。
また、表現力も設定をいじればなかなかのものです。
こんな感じです。
また、更新頻度も高く、今日時点（2020/08/07）では、最終更新日が３日前でした。
評価も高いですね。
この記事では、Enlighter で Crayon Syntax Highlighter で作成したコードを互換機能を使用して表示するための設定をご紹介します。
Crayon Syntax Highlighter 互換モードの有効化
まず、Enlighter をインストールする必要がありますが、単純にプラグインの新規追加で「Enlighter」と検索し、最初に出てきたものをインストールし有効化するだけです。
この時に、Crayon Syntax Highlighter のプラグインを無効化するのを忘れないでください。そうしないと表示上問題が起きる可能性があります。
それから、互換モードを有効にします。
Enlighter のメニューの Compatibility をクリックします。
Compatibility Mode タブの Compatibility mode を Enable にして、「変更を保存」します。
Crayon タブの Compatibility mode で、Crayon を Enable にして、「変更を保存」します。
これで、Crayon Syntax Highlighter の互換モードが有効になりました。
表示のカスタマイズ
デフォルトだと、ほぼ真っ白な表示になってしまうので表示をカスタマイズします。
Enlighter のメニューの Appearance をクリックします。
Appearace タブの設定項目をすべて変更します。
Theme は Classic にします。テーマですね。
Code indentation は 2 Spaces にします。コードのインデントですね。
Text overflow は Add scrollbar にします。コードが画面サイズを超えた時にスクロールバーを表示します。
Line-numbering は 無効にします。ナンバリングを表示すると、余白が大きくなりすぎるためです。
Line-hoverefect は 有効にします。マウスがコードに上に来るとハイライト表示するようになります。
RAW-Code on doubleclick は有効にします。ダブルクリックすると修飾なしの表示になります。
「変更を保存」します。
Toolbar タブでは、ツールバーの表示設定ができますが、こちらはお好みで。自分は非表示にしましたが。
これで、コードを表示すると、こんな感じになりました。
なかなかいい感じですね。
移行作業なしでこれなら大満足です。
おわりに
Crayon Syntax Highlighter の移行先の代替プラグインとして Enlighter をご紹介し、互換モードの設定方法についてもご紹介しました。
今では、Crayon Syntax Highlighter は互換性やセキュリティ的に不安が大きいので、できるなら Enlighter への移行をオススメします。
