サイトの模様替え

WordPressテーマをデフォルトのTwenty FourteenからSimplicity2に変更した。

WordPress 5から導入されたGutenbergに合わせ、サイトのソースを修正した。

1. クラシックブロックをブロックに変更（ブロックコードで挟み込む）
2. img要素をfigure要素に変更
3. 多くのsamp要素を除去またはcode要素に変更

1と3はコードエディタで行った。いや、皆様のご意見どおり、ひどい。自動修正機能が効きすぎており、例えばブロックコードを閉じ間違えるとブロックごと消え去るなど、泣きたくなる仕様である。一方、「ブロック単位での修正」は、これまでに比べれば容易にはなっているようである。2は大変楽であった。このため、まずビジュアルエディターで文章をブロック単位で構成し、細かいところをコードエディタで詰めていく、という入力スタイルを採るのが良さそうである。

3については、コマンド名やファイル名はsamp要素とする、と思い込んでいたが、そうでもなかった。コマンド名はsamp要素を付けず、ファイル名はcode要素に変更した。反対に、コンソール出力例はsamp要素としてみた。

せっかくソースも書き換えたことだし、テーマも評判の高いSimplicity2に変更した。無料のWordPressテーマにはもう一つ、定番のLuxeritasがある。こちらは別館で使用した。Simplicity2はhighlight.jsによるソースコードハイライト機能が備わっていたためである。当サイトではソースコードとコンソール出力の両者をpre要素に指定していることから、「カスタマイズ→ソースコード→ハイライトするCSSセレクタ」に“.entry-content pre.wp-block-code”を指定し、コンソール出力のハイライトを抑止した。ソースコードのハイライトを抑止したい場合は、nohighlightクラス属性を付ければよい。

また、サイトロゴをHatchfulで作成した。本館と別館の2種を作成し、色味を整えた後、別館のフォントをRacing Sans Oneで置換した。これに伴い、faviconのフォントと色も修正した。

ほとんどカスタマイズをしていないのに、すっきりと見やすいサイトに様変わりした。素晴らしい。「誤魔化す」という言葉の意味を思い知らされた次第である。