Hara Daizo WordPressの404ページは、存在しないURLへアクセスしたときに表示する案内ページです。404エラーそのものを消すための機能ではなく、見つからなかったユーザーをサイト内の適切なページへ案内する役割があります。
公開済みの投稿が404になる問題を直したい場合は、先にWordPressの404エラー原因と直し方を確認してください。この記事では404ページ自体の作成・カスタマイズに絞ります。
WordPressの404ページとは｜404エラーの直し方との違い
WordPressは、リクエストされた投稿・固定ページなどが見つからない場合に404用テンプレートを使います。ブロックテーマでは404.html、クラシックテーマでは404.phpが代表的なテンプレートです。
「404ページを作る」は、存在しないURLで見せる内容を整える作業です。「存在する投稿が404になる」は、URLやrewriteなどを直す復旧作業です。この2つを混同しないことが重要です。
404ページに入れておきたい内容
404ページは情報を詰め込むより、次に進める導線を用意します。
| 要素 | 目的 |
|---|---|
| ページが見つからないことを明記 | ユーザーに現在地を伝える |
| トップページへのリンク | サイトの入口へ戻れるようにする |
| サイト内検索 | 目的の記事を探せるようにする |
| 主要カテゴリー・主要ページ | よく使う導線へ移動できるようにする |
| 簡潔な説明 | URL変更・削除の可能性を伝える |
エラーなのに通常ページと同じ長いセールス文章を置く必要はありません。目的は「迷子になったユーザーを戻すこと」です。
ブロックテーマで404ページを編集する方法
ブロックテーマではサイトエディターから404テンプレートを編集できます。WordPress公式ドキュメントでも、サイトエディターの「テンプレート」に404などのページ種別が表示されます。
サイトエディターから404テンプレートを開く
一般的な流れは次のとおりです。
- WordPress管理画面で「外観」→「エディター」を開く
- 「テンプレート」を開く
- 404テンプレートを選択する
- ブロックで見出し・説明・検索・ナビゲーション等を編集する
- 保存する
テーマによって用意されているテンプレートや名称は異なります。404テンプレートが表示されない場合は、テーマがブロックテーマか、テンプレート追加に対応しているか確認します。
検索・ホームへのリンク・ナビを配置する
404テンプレートでは、見出し、段落、検索、ナビゲーション、ボタンなど通常のブロックを利用できます。
「ホームへ戻る」だけでなく、コンテンツ量が多いサイトは検索を置くと目的ページを見つけやすくなります。リンク先は404にならない現在のURLを使います。
クラシックテーマで404.phpを作成・編集する方法
クラシックテーマでは、テーマの404.phpが404ページの表示を担当します。テーマに404.phpがない場合は、WordPressのテンプレート階層に従ってフォールバックします。
独自に作る場合は、使用中テーマの構造に合わせてヘッダー、フッター、本文を構成します。テーマファイルを直接編集するとアップデートで変更が消えるため、継続的なカスタマイズは子テーマや開発環境で行います。
テーマファイルエディターでPHPを直接修正すると、構文エラー時にサイトを表示できなくなる可能性があります。SFTPやローカル・ステージングなど、元に戻せる方法を優先してください。
子テーマで404ページを安全にカスタマイズする
親テーマの404テンプレートを変更したい場合は、親テーマを直接書き換えず、子テーマへ必要なテンプレートを用意する方法があります。
子テーマの基本はWordPressの子テーマの作り方を確認してください。テーマによって独自フックやテンプレート構造を使っている場合は、そのテーマの公式仕様も優先します。
テーマ開発全体のテンプレート階層はWordPressテーマの自作でも扱っています。
プラグインで404ページを作る場合
テーマファイルを編集せず、404ページを指定できるプラグインを使う方法もあります。導入前に次を確認します。
- 実際のレスポンスが404になるか
- 使用テーマとの互換性
- プラグイン停止時にどう表示されるか
- リダイレクト機能と404表示機能を混同していないか
- 更新が継続しているか
固定ページを一枚作り、それを表示するだけのプラグインでも、HTTPステータスを404として返す実装か確認してください。
404ページがHTTP 404を返しているか確認する
404ページは見た目だけでなく、レスポンスコードが重要です。
存在しないテストURLへアクセスし、ブラウザーの開発者ツールのNetworkやcurl -Iなどで404が返っているか確認します。デザインした404ページが表示されていても、レスポンスが200なら検索エンジンからsoft 404と判断される可能性があります。
同様に、存在しないURLをすべてトップへ301する方法も避けます。移動先がないURLは404または410を返す方が状態を正しく伝えられます。
404ページのSEO｜soft 404とリダイレクトの注意点
Googleは、存在しないURLが正しい404を返すこと自体は一般に検索パフォーマンスの問題ではないと説明しています。
SEOで優先するのは、404をゼロにすることではありません。
- 移動したページは適切な新URLへリダイレクト
- 完全削除で代替がなければ404または410
- サイト内のリンク切れは修正
- サイトマップから不要URLを除外
- 404ページ自体はHTTP 404を返す
- 無関係なトップページへ一律転送しない
404ページを便利にすることと、URLのHTTP状態を正しく返すことを両立させます。
404ページをテストする方法
公開後は、実在しないURLを使って次を確認します。
- 独自の404ページが表示される
- HTTPステータスが404
- ホーム・検索・主要リンクが正常
- スマートフォンでもレイアウトが崩れない
- ログイン中・ログアウト中の両方で確認できる
- キャッシュやCDNを使っていても404が正しく返る
テストURLは、実在する投稿と衝突しないランダムな文字列にします。
よくある質問
固定ページを作るだけでは、存在しないURLの404テンプレートとして使われるとは限りません。テーマの404テンプレート、または404表示に対応した機能を設定する必要があります。
原則として一律の自動転送は避けます。ユーザーが探していたURLとトップページは内容が異なり、soft 404の原因になることがあります。404ページ内にトップへのリンクを置く方法が分かりやすいです。
正しい404レスポンスを返していれば、通常のインデックス対象ページとして扱わせる必要はありません。まずHTTP 404が返っていることを確認する方が重要です。
まとめ
WordPressの404ページは、存在しないURLへ来たユーザーをサイト内へ戻すための案内ページです。ブロックテーマならサイトエディターの404テンプレート、クラシックテーマなら404.phpを中心に編集します。
見た目だけでなくHTTPステータスが404のままか必ず確認し、存在しないURLをトップへ一律転送しないことも重要です。