WordPress のテーマ制作やカスタマイズにおいて、文字コードと改行コードの設定を見落とすことがある。両方とも正しく設定されていないと、予期せぬ不具合(文字化けや原因不明の余白など)が起きるので注意が必要だ。
テキストエディタで各ファイルを編集するさい、文字コード・改行コードは以下のとおり設定しよう。
- 文字コード:UTF-8(BOM なし)
- 改行コード:LF
とくに文字コード UTF-8 の「BOM あり」と「BOM なし」の違いに気をつけてほしい。
目次
文字コードとは
文字コードとは、文字に割り振られた固有の番号を指す。
文字コードとは、コンピュータなどの電子媒体において、文章を画像などの図形データとしてではなくテキストの形式で扱う場合に、その各文字(単一の文字でない場合もある)に対して持っている符号(コード)のことである。
文字コード(Wikipedia)
コンピュータは、固有の番号をもとに「あいうえお」など人が読める文字に変換して表示している。
日本語の Web サイトでは「Shift_JIS」「UTF-8」「EUC-JP」のいずれかが使われており、WordPress は「UTF-8」が標準となっているので必ずこの文字コードに合わせよう。
WordPress 3.5 から UTF-8 がデフォルトになり、管理画面から変更できなくなっている。
テーマ制作やカスタマイズ時に文字コードの存在に気づかず、「Shift_JIS」など別の文字コードでファイルを作成・更新すると文字化けやエラーの原因となる。
文字コードをどこで設定するのか
HTML では、<head>
内で文字コードを指定する。指定しなかった場合はブラウザが自動的に判別してくれるが、文字化けを避けるためにも必ず指定しておきたい。
<meta charset="utf-8">
WordPress のテーマ制作やカスタマイズでコードを書く場合、テキストエディタの文字コードも「UTF-8」に設定する必要がある。
たとえば「Notepad++」というエディタでは、「エンコード」から文字コードを指定できる。

上の画像でわかるとおり、「UTF-8」と「UTF-8 BOM」の 2 種類が選択できるが、WordPress で使うのは「BOM なし」のほうである。
単に「UTF-8」と表示されていても、エディタによって「BOM あり」か「BOM なし」か違ってくるため、各エディタのヘルプを参照してほしい。
エディター | BOM あり | BOM なし |
---|---|---|
Windows メモ帳 | UTF-8(BOM 付き) | UTF-8 |
TeraPad | UTF-8 | UTF-8N |
Notepad++ | UTF-8 BOM | UTF-8 |
Windows 付属のメモ帳は「Windows10 19H1」より、「UTF-8(BOM なし)」が扱えるようになった。
UTF-8「BOMあり」「BOMなし」の違い
BOM は Byte Order Mark の略で、「これは Unicode で書かれたファイルである」というのを明示するデータのことだ。
UTF-8 ならどちらでもよさそうに思うかもしれないが、WordPress では BOM があると functions.php が正常に動かないなど予期し得ないエラーを起こす原因となる。
とくに WordPress 初心者は文字コードの存在を知らず、テキストエディタではなく Word など文章作成ソフトで編集してしまうケースが多い。必ず文字コードを変更できるテキストエディタを使おう。
「コードをコピペしたのに動かない」「カスタマイズしたらブログが真っ白になってしまった」という相談をいただくが、かなりの確率で文字コードが間違って指定されていた。
BOMの有無を確認する方法
コードが正常に動かないなど不具合が出たときは、バイナリエディタで BOM の有無を確認するとよいだろう。Vector でダウンロードできる。
「BOM あり」のファイルをバイナリエディタで開くと、以下のとおり先頭に「EF BB BF」という文字列が確認できるはずだ。

「BOM なし」にはその文字列がない。

通常のテキストエディタでもファイルの文字コードを確認できる。先に紹介した Notepad++ であれば、右下に文字コードが表示されている。

「BOM あり」になっていたら、「BOM なし」に変更して作業を進めよう。
UTF-8(BOMなし)に変更する方法
文字コードの変更は簡単で、テキストエディタで上書き保存するだけだ。
Notepad++ は上部メニューの「エンコード」から変換し、そのままファイルを上書き保存すれば OK。

一般的なテキストエディタであれば、同様の手順で変換できる。
改行コードは「LF」を使うのが無難
文字コードのほかに「改行コード」というものもある。
標準の改行コードは OS によって変わるが、WordPress では「LF」を指定しておくのが無難だ。
Notepad++ は「編集」から「改行コード変換」で指定し、変換後にファイルを上書き保存する。

テーマファイルの変更なら「CR LF」でもとくに不具合は出ないと思うが、データベースを操作するさいは「LF」にしておいたほうがよい。
まとめ
WordPress テーマファイルを編集するときは、文字コード「UTF-8(BOMなし)」・改行コード「LF」に設定して作業する、と覚えておこう。
なお、WordPress 管理画面から直接テーマファイル・プラグインファイルを編集できるが、最悪の場合ログインできなくなるなど致命的なエラーの原因となりやすいため、あまりおすすめしない。
面倒でも FTP で各ファイルをダウンロードして編集するか、各ファイルのコードを全コピーしてテキストエディタに貼り付けてから編集しよう。作業直前にはバックアップをとる習慣もつけておきたい。
記事執筆:Reinx 編集部 瀬尾 真
Web 業界歴 20 年の知見と経験をもとに、初心者でも楽しくブログ運営に取り組んでいただけるよう、WordPress や SEO のノウハウを提供しています。Twitter では最新ニュース・小技集を配信中。

ブログ初心者向けサービス
Reinx では、WordPress ブログ初心者向けに様々なサービスをご用意しています。
その他、運営に関するお悩みなどがありましたら、お気軽にお問い合わせください。