WordPressでソースコードの表示をカスタマイズしてみた

スポンサーリンク

ITStudyのサイトでは時々、プログラミングに関する記事を書いています。ソースコードを公開する時は、ブロックの追加で「ソースコード」を使用しています。

先日、公開した「PowerShellでRPAもどきをやってみた」にソースコードを公開していますが、デフォルトだと以下のように表示されていました。

今までカスタマイズせずに使っていたのですが、WordPressで「Cocoon」のテーマを使用していると簡単に設定変更できることを知りました。早速、Cocoonの設定を画像の通り変更してみます。

行番号を表示して、ダークカラーにしてみました。今までより見やすくなったかなと思います。

一旦、手を付けるといろいろとカスタマイズしたくなりますね。ソースコードをコピーする機能が欲しいなと思ったのでググって見ると「Prism.js」を使うのが良さそうです。

ただ、初期設定がいろいろあるようなので実際に試してみて想定通り動けば別記事として紹介したいと思います。

コメント