バイトオーダーマークとは？

WordPressにダークモードを追加した際に、右上のアイコンの位置がページによってズレていることに気がついた。

LV73.net ダークモードを追加してみた

トップページとその他のページで謎の空白が存在したので、その原因と対処について書く。

原因

Chromeの検証機能を使って調べてみた結果、&#65279という見えない文字が入り込んでいた。

検索してみると、これはBOM（byte order mark：バイトオーダーマーク）と呼ばれるUnicodeの符号化形式を表示したものらしい。

バイトオーダーマーク – Wikipedia

記憶にないが、Windows標準のメモ帳などで保存した際に、BOM有りのUTF-8で保存してしまったようだ。

直すためには高機能なテキストエディタであるTeraPadやMeryを使って保存し直せばよい。

TeraPad：メニュー>ファイル>文字/改行コード指定保存

Mery：メニュー>名前を付けて保存

高機能なテキストエディタであれば、他の物でも出来るはず。

今回はトップページだけだったので、テーマのindex.phpファイルを保存し直したら解決した。

感想

たまたまダークモードで右上にアイコンを配置したことで気がついた。分からないことがあったらChromeの検証機能。

参考

ヘッダーの上の「妙な空間」は『&#65279』かもしれない。 – 株式会社ネディア │ネットワークの明日を創る。