WordPressの404エラーとは?原因とエラーページの設定方法

こんにちは!エンジニアのノムラです。WordPressで404エラーがでる原因やエラーページを設定する方法って知っていますか?

この記事では、

  • 【基礎】404エラーとは?
  • 【基礎】原因や影響は?
  • 【応用】404ページを作成しよう
  • 【応用】リダイレクトさせよう

といった流れで、404エラーの原因や対処法について解説していきたいと思います。404エラーの原因や対策を取っておくことで、ユーザが使いやすいサイトを作成していきましょう。

404エラーとは

そもそも、404エラーとはどんな時にでるエラーなのでしょうか。ここでは、原因や404エラーがもたらす影響について解説していきたいと思います。

原因は何?

WordPressでは、以下のような場合に404エラーがでます。

  • URLを打ち間違えた時
  • 削除された記事へアクセスした時
  • リンク切れしているリンク先に飛ばそうとした時

要は、サイト内で存在しないページにアクセスしようとした時に、404 not foundのエラーがでます。また、パーマリンクの設定がうまくいっていない場合でも404エラーがでることがあります。

身に覚えのない404エラーがでた時は、パーマリンクの設定を更新しましょう。設定>パーマリンク設定から更新ボタンをクリックするだけで直すことができます。

影響はあるの?

404エラーはSEO的に影響があるのか気になるところだと思いますが、結論から言うと影響はないと言われています。

404 エラーのほとんどは、そのサイトの Google 検索結果でのランキングに影響を及ぼすことはないため、エラーを無視しても問題はありません。

https://support.google.com/webmasters/answer/35120?visit_id=1-636228984297301448-4288296348&rd=1#common_url_errors#url_404

しかしGoogleは、アクセスしたユーザが探している情報を見つけやすく、サイト内を探しやすくするという理由で、404ページのカスタマイズを推奨しています。

サーバーへのアクセス権がある場合は、独自の 404 ページを作成することをおすすめします。404 ページをわかりやすくカスタマイズすることにより、探している情報の場所をユーザーに知らせたり、役に立つ他のコンテンツを提供したり、サイト内をさらに探すよう促したりできます。

https://support.google.com/webmasters/answer/93641?hl=ja

SEO的に直接影響は内容ですが、404ページをカスタマイズすることで、ユーザにとって使いやすいサイトにすることができるんですね。

404ページを作成しよう

それでは、WordPressで404ページを作成してみましょう。今回サンプルでは、Twenty Seventeenのテーマを使ったサイトに404ページを作成していきたいと思います。

外観>テーマの編集の画面を開き、右のサイドバーに404テンプレートのファイルがあるか確認しましょう。

Twenty Seventeenには404.phpが用意されていたので、このファイルを編集します。ない場合はデフォルトのテンプレートからコピーしてきましょう。

/wp-content/themes/default/404.phpを、現在使用しているテーマのディレクトリにコピーします。

404.phpの用意ができたら早速カスタマイズしていきます。今回404ページに以下のコンテンツを表示します。

  • 検索ボックス
  • メッセージ
  • トップページに戻るボタン

404.phpに記述するコードは以下です。

<?php get_header(); ?>

<div class="container" style="width:30%; margin:auto;">
    <h2>お探しのページは見つかりません。</h2>
    <p>サイト内を検索してみませんか?</p>
    <?php get_search_form(); ?>

</div>
<p style="text-align:center; margin-top:30px;"><a href="<?php echo home_url(); ?>">HOMEへ戻る</a></p>

<?php get_footer(); ?>

ブラウザで確認すると以下のようになります。

ただ404エラーページを表示するより、トップページに戻れたり、別の記事を検索できたりすると、ユーザを別の記事に促すきっかけになりますね。

リダイレクトさせよう

404エラーが出た場合、404ページを表示するのではなく、自動的に別ページにリダイレクトさせるのも1つの対処法となります。

WordPressには、404エラーが表示されているかどうかを判定する関数is_404()と、リダイレクトを実行する関数wp_safe_redirect()があります。

これを使って404エラーが表示されている場合は、トップページにリダイレクトするよう実装してみましょう。

管理画面の外観>テーマの編集からfunction.phpを開き、以下のコードを記述します。

function is404_redirect() {
  if( is_404() ){
    wp_safe_redirect( home_url( '/' ) );
    exit();
  }
}
add_action( 'template_redirect', 'is404_redirect' );

404ページにアクセスするか、サイト内の存在しないURLにアクセスすると、自動でトップページにリダイレクトします。

リダイレクトについて、詳しく知りたい人は以下の記事を参考にしてください。

WordPressでリダイレクトを使ってSEOの評価をあげる簡単な方法
更新日 : 2020年6月11日

そもそもリダイレクトとは?というところから、リダイレクトを簡単に実装するプラグインの紹介まで、わかりやすく解説しています。

まとめ

ここまで、404エラーとは?といった基本的な内容から、404ページの作成方法まで解説してきました。404エラーの対応がしっかりできていると、ユーザの安心や信頼にも繋がります。

404エラーについてしっかり理解し、素敵なサイトを作成しましょう!

「プログラミング、右も左もわからない…」という方にオススメ

当プログラミングスクール「侍エンジニア塾」では、これまで6000人以上のエンジニアを輩出してきました。

その経験を通してプログラミング学習に成功する人は、「目的目標が明確でそれに合わせた学習プランがあること」「常に相談できる人がそばにいること」「自己解決能力が身につくこと」この3つが根付いている傾向を発見しました。

侍エンジニア塾は上記3つの成功ポイントを満たすようなサービス設計に磨きをかけております。

cta_under_bnr

「自分のスタイルや目的に合わせて学習を進めたいな」とお考えの方は、ぜひチェックしてみてください。

書いた人

ノムラ

WEBエンジニアをやっています。
プログラミング初心者にもわかりやすく解説ができるよう頑張ります。

おすすめコンテンツ

まずはここから!初心者でも1から学べるプログラミング入門カリキュラム

転職成功で受講料0円!あなたもプログラミングを学んでエンジニアデビュー