こういう技術系ブログ(?)では、プログラミングコードを見やすく表示させるのに、いわゆる Syntax Highlighter を使用すると思うのですが、この度私、雑廉堂は Crayon Syntax Highlighter と Syntax Highlighter Evolved と決別することにいたしました。

 

Syntax Hilighter

WordPress で プログラムコードを綺麗に見やすくしたい、といえば Syntax Highlighter Evolved でしょう。もう少し昔は、Crayon Syntax Highlighter っていうのもありました。

私は主に Crayon を使っていましたが、このプラグインはこの3年ほど更新されていない上に、WordPress5 では未検証。さらに、PHP7.3 以上を使用するとエラーを吐いてページが表示されません。

GitHub では有志の方がPHP7.3対応させた Crayon を提供してくれているみたいですが、更新を手動でしないといけないのは何かと面倒。。

Crayon を使う前は、Syntax Highlighter Evolved を使用していたのですが、ちょっとデザインと言うかスタイルが少し気に入らなかったので、すぐに Crayon に乗り換えてしまいました。

ただ、これはどちらにも言えることですが、ちょっとスタイルの設定が面倒くさい。タイトルバーはいるのか、行番号の表示は必要なのか、カラーテーマはどうするのかなどなど。

また、最近はマークダウンで記事を書くことも多く、下書きではマークダウンでコードを記述して、公開前にコードの部分のみ Crayon のコードに書き換えていました。これもまた、面倒くさい。

それに最近は、カラフルなコードスタイルではなくシンプルなスタイルの方がトレンドになっているように思います。

 

WP Githuber MD

今回、Crayon と Evolve との決別を決めさせてくれたのは、以前の記事でも紹介した、WP Githuber MD ですね。

WP Githuber MD については、記事の方を見ていただければいいと思いますが、結局あの記事を書いた後、ほぼこちらに切り替えて記事を書くようになりました。

というのも、一度マークダウンで書くともうそこから離れるのが難しくなるのもありますし、画像をクリップボードにコピーして、記事上に直接ペーストできるのがめちゃくちゃ便利です。

あと、常にプレビュー表示がでてくれるのも地味に便利です。まぁ便利なんですが、記事を書き進めていくうちにプレビューの位置がどんどんずれていくので、結局プレビュー表示なしにしていることも多いですが。。

また、このプラグイン自身に Syntax Hilight 機能を持っているんですよね。

これが、Crayon 達との決別を決める一番大きな理由です。下書きではコード部分をマークダウンで書いて、公開直前に Crayon に合わせて <pre>タグで書き換えるのは本当に面倒くさいんですよ。

 

記事の変換はどうする?

Evolve で装飾しているコードは一部しかなかったので、それは手動で書き換えました。

で、Crayon で書いた分については、基本 <pre> タグで書いているので、そのままでも問題なく表示されます(カラーで装飾はされませんが・・)。

Search Regex というプラグインを使えば、正規表現を使って一括して変更できそうなんですが、ちょっとまだ怖くてやっていません・・。当面は過去記事についてはそのままでも良いかなと思っています。

まとめ

WP Githuber Plugin を導入することで、Crayon や Evolved などの Syntax Highlighter 系のプラグインの呪縛から開放されたような感じがします。

もしマークダウンに慣れているのであれば、一度使ってみることをおすすめします。


0件のコメント

コメントを残す

メールアドレスが公開されることはありません。